#React Tutorials – Day 2 – Environment Setup by @pankajmalhan30 cc @CsharpCorner #ReactJS

#React Tutorials - Day 2 - Environment Setup by @pankajmalhan30 cc @CsharpCorner  #ReactJS

  • Create React App

    After installing the React global packages now run “create-react-app reactapp” command, this command will create a React project and name this project as “reactapp”.

  • Now you are in root directory of the project again run the “npm start” command this command run the React project on “3000” port.
  • Now, run the command “dotnet new React“

    This command creates a template project for React Application.

  • Using Webpack and Babel

    So far we set up the React Environment set up using the npm and Visual Studio 2017 SPA templates.

  • Now we will focus on the Webpack and babel to setup the React project.

In this article you will learn about Environment Setup in React.
Continue reading “#React Tutorials – Day 2 – Environment Setup by @pankajmalhan30 cc @CsharpCorner #ReactJS”

#React Tutorials – Day 2 – Environment Setup by @pankajmalhan30 cc @CsharpCorner #ReactJS

#React Tutorials - Day 2 - Environment Setup by @pankajmalhan30 cc @CsharpCorner  #ReactJS

  • Create React App

    After installing the React global packages now run “create-react-app reactapp” command, this command will create a React project and name this project as “reactapp”.

  • Now you are in root directory of the project again run the “npm start” command this command run the React project on “3000” port.
  • Now, run the command “dotnet new React“

    This command creates a template project for React Application.

  • Using Webpack and Babel

    So far we set up the React Environment set up using the npm and Visual Studio 2017 SPA templates.

  • Now we will focus on the Webpack and babel to setup the React project.

In this article you will learn about Environment Setup in React.
Continue reading “#React Tutorials – Day 2 – Environment Setup by @pankajmalhan30 cc @CsharpCorner #ReactJS”

React, first steps (Webpack and Babel)

  • As these packages are all development devepdancies only we’ll install them doing the following:

    Our should now have the following packages:

    Lets first configure babel so it knows how to transpile our code how we need it to.

  • We’ll create a file for our babel settings.
  • This file just contains some json with some settings which tell babel how to behave.
  • Now we need to set up webpack to use babel and bundle the javascript for us to use in our site.
  • Finally, in order for us to compile the javascript, we need to install the webpack package globally:

    We can then just run:

    This should create in .

Getting started with React can be a big hurdle. Before you can get started creating your react app, youll need an environment that compiles ES6 into Javascri…
Continue reading “React, first steps (Webpack and Babel)”