Create a Simple React App in the Visual Studio Code.

 For Creating a Simple React App in the Visual Studio Code. Please follow the following steps;

Step1:

        Install the Node.js on the Computer. For installing the Node.js click on the below link.

Node Installer


Step 2:

            Install the Visual Studio Code on the computer.

Step 3:

            Open the Visual Studio Code. 

            Click on the Terminal tab. 

            Write the command to check Node is installed on the machine or not. 

             node -v 

            



Step 4:

            Write the following command on the Terminal to install the latest version of npm.

            npm install -g npm

            


Step 5:

            Now run the below command to create the React App.

            npx create-react-app react-app

            


    Now your app is created on the specific path.


Step 6:

        Run the following command to go to the react-app path.

        cd react-app

        Now run the following command to start the react-app.

        yarn start

        Your app is open in the browser as Shown.



Note:

    The app was not created with capital letters.

    If the error occurs please install the yarn on the computer to overcome the error.

Disclaimer:

    If you have any questions and queries. Feel free to ask. Your feedback is also highly appreciable.

    Feel free to Feedback or Comment on the Article. Thanks. @learnyit

Comments

Post a Comment

Popular posts from this blog

Create custom workflow in D365 X++

Image
 For the creation of Custom Workflow in Dynamics 365 F&O, Kindly follow the following steps; 1. Create a custom Enum WorkflowStatus or you can use an existing one.   2. Create a new table EmployeeLeave as defined below and add the above Enum as a field and name it LeaveStatus . 3. Create a new form EmployeeLeaveForm by using the above table as a data source.   4. Create a new Display Menu Item EmployeeLeaveForm for the above form and add to any  Module by creating an extension of the Module Menu from the application Explorer. 5. Create a new Query EmployeeLeaveQuery  and add  EmployeeLeave as a data source.                 6. Create a new Workflow Category EmployeeLeaveCategory .   7. Create a new workflow type EmployeeLeaveWorkflowType .   • Category: Select the workflow category from the previous step • Query: Select the query created for the document table • Document menu item: Sel...
Read more

Convert amount from one currency to another currency using X++

  You can use the following X++ code snippet for currency amount conversion.     CurrencyExchangeHelper currencyExchangeHelper;     AmountMst amountMST;     CurrencyCode FromCurrency =  'PKR';     AmountCur amountCur = 5000;     currencyExchangeHelper = CurrencyExchangeHelper::newExchangeDate(Ledger::current(), systemDateGet());     amountMST =  currencyExchangeHelper.calculateCurrencyToCurrency(fromCurrency, SLDFabCostSheetsCalculation.Currency,amountCur,true);        info(strFmt("%1", amountMST));
Read more

How to Create Extended Data Types (EDTs) in Finance and Operations of Dynamics 365 -- F&O Customization Part 2

Image
For Creating Extended Data Types (EDTs) in Finance and Operations of Dynamics 365 follow the following steps: Step # 1:        Right-click on the project to Add -> New Items as shown in the figure;     When you click the New Item ,  the new window is open as shown in the figure;     Select the Data Types from the Side Bar and click on the Add button as shown in the figure; Step # 2:          Now right click on the EDT and select the Properties as shown in the figure;               When you click the Properties button, the left panel is open, you can set the properties of EDT here,           mostly used properties are Label and Help Test. I have created four EDTs as shown in the figure;           You can check the EDTs in the Application Object Tree ( AOT ) as shown in the figure;          If ...
Read more