.Net Core MVC Installation

Steps to install the Materialize .Net Core MVC on your system🧑‍💻


Installation

  1. First of all, make sure you have installed Node (LTS). If Node.js is already installed in your system, make sure the installed version is LTS and jump to step 2.
  2. Once you have npm installed you can run the following command to install and upgrade yarn. If you want to use npm than you can skip this step.
  3. npm install --global yarn
  4. Install the Gulp CLI: Open Terminal/Command Prompt and run the following command and wait until it finishes. If you have already installed Gulp CLI, you can skip this step and jump to step 3.
  5. npm install --global gulp-cli
  6. Install .NET Core SDK: https://dotnet.microsoft.com/download.(Skip this step if using Visual Studio)
  7. Open AspnetCoreMvcFull or AspnetCoreMvcStarter folder in VS Code.
  8. In VS Code Extensions Tab, search @recommended and Install Workspace Extensions. (Skip this step if using Visual Studio)
  9. Navigate to the Materialize root directory AspnetCoreMvcFull or AspnetCoreMvcStarter and run following command to install our local dependencies listed in package.json.
    You can use npm OR yarn as per your preference.
  10. # For Yarn
    yarn
    
    # For npm
    npm install --legacy-peer-deps

    Reason for using npm install -legacy-peer-deps: In the new version of npm (v7), by default, npm install will fail when it encounters conflicting peerDependencies. Read more

    The above command will install all the required Node.js modules into the node_modules/ directory inside your app folder. While installing this command you may see few warnings, don't worry about that for more details refer to our FAQ npm/yarn install warnings.

  11. To build the assets, run the following command:
  12. yarn build

    Find more about assets compilation here

  13. To run the Materialize application, use below command :
  14. dotnet watch

    That will make your application to run in the browser automatically. Also, Restarts or hot reloads the specified application when changes in the source code are detected.

    Also, find more about watch command here

For Visual Studio

  1. Follow Step 1, 2 & 3 as described above
  2. Install Visual Studio from here
  3. Open the solution (.sln) file in Visual Studio.
  4. In the solution explorer window right click on package.json and select Restore Packages. Wait while packages restored.
  5. Open tasks window: View > Other Windows > Task Runner Explorer
  6. Run build task to compile assets.
  7. Run the project with / without debug. Debug > Start Debugging

Available Tasks

Open command prompt/terminal, go to the Materialize root directory and run yarn {task_name}.
For example, To generate compile assets, run yarn build.

Development Tasks (Yarn/Gulp)

Task (yarn or gulp) lists for development.

Yarn Task Gulp Task Description
yarn watch gulp watch Watch files for changes and automatically recompile them when it changed.
yarn build gulp build Compile sources and copy assets.
yarn build:css gulp build:css Compile SCSS sources and generate CSS.
yarn build:js gulp build:js Transpile & Compile JS sources using Webpack.

Production tasks (Yarn/Gulp)

Task (yarn or gulp) lists for production.

Yarn Task Gulp Task Description
yarn build:prod gulp build --env=production Run build task in production environment.
yarn build:prod:css gulp build:css --env=production Run build:css task in production environment.
yarn build:prod:js gulp build:js --env=production Run build:js task in production environment.

.Net Commands

.Net command to run and watch the application. Find other commands from microsoft here.

.NET Task Description
dotnet run Run the application.
dotnet watch Watch files for changes and automatically recompile them when it changed.
dotnet build Builds a project and all of its dependencies.
dotnet publish Publishes the application and its dependencies to a folder for deployment to a hosting system.

For .Net Core hosting and deployment documentation, please refer this

© 2017- Pixinvent, Hand-crafted & Made with ❤️