Skip to main content

React Js Commands

React JS Commands and Useful purposes 

To Install react app: npx create-react-app app-name
To Install react app: npx create-react-app .

To check npm version: npm --version

Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

node -v (To check node version)

The latest recommended command to create a new React app is:

npx create-react-app@latest my-app

Replace my-app with your desired project name. This approach uses the latest version of Create React App and works if Node.js (version 14+) and npm (version 5.2+) are installed

Modern Alternatives
If you prefer a faster, lighter setup, many developers now use Vite for new React projects:

This command also creates a new React app but with the Vite build tool.

# Using npx directly
npx create-vite@latest my-app --template react

# Or without specifying template (interactive mode)
npm create vite@latest my-app

Either option gives you a complete React project structure—just navigate into your project folder and start coding with npm start or yarn start.
The double dash syntax ensures that npm properly forwards the --template react argument to the create-vite tool rather than trying to interpret it as an npm argument

Comments

Popular posts from this blog

Data Types in Python

Data Types  In C# or Java, You need to declare a variable specify them integer, string, and decimal. But in Python no need to specify. We can declare variables like Example: C# or Java int age = 28; string Name = "Siddhu"; Example: Python age = 28 Name = "Siddhu" So, you don't need to declare variable types in python. This is an advantage in Python, But still have few Disadvantages too. Example: In my Python function def add_numbers(x,y): print(x+y) add_numbers(20,50) //Output: 70 add_numbers(20,"Something") //Error:"Traceback (most recent call last): File "C:/Users/siddhartha.e/PycharmProjects/siddhu-py/my1stpycode.py", line 8, in add_numbers(50,"Something") File "C:/Users/siddhartha.e/PycharmProjects/siddhu-py/my1stpycode.py", line 4, in add_numbers print(a + b) TypeError: unsupported operand type(s) for +: 'int' and 'str'" ...

Database and Migrations

Database and Migrations You can config Database in the .env file. By default, Laravel has MySQL configuration. For example, I configured my details DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=Laravel_tutorials DB_USERNAME=root DB_PASSWORD= So how it connects the database, In your root folder config/database.php file will read the .env file configuration. Migrations: Migrations are most likely a version control for your database. Advantages You can easily allow your team to modify database schema and share to everyone in the application No headache to add a new column in the database manually. This migration will help all teammates into one path. Now check with artisan command php artisan migrate php artisan migrate This command will create basic users,password_resets and migrations tables. Here migrations table will track of all migrates You can undo previous migration using rollback command php artisan ...

Laravel form validations

 Laravel Validations: List of types "first_name" => 'required|alpha:ascii|min:3|max:100',// alpha:ascii (only accepts a-z) "middle_name" => 'string', "last_name" => 'required|string', "email" => 'required|email|unique:users,email', "password" => 'required|string|confirmed', "sex" => 'required|string', "phone_no" => 'required|string', "account_type" => 'required|string', "dob" => 'required|date_format:d-m-Y', // date with format "nationality" => 'required|string', "company" => 'required|string', "company_sector" => 'required|string', "company_address" => 'required|string' "bank_account_no" => 'required|min_digits:3|max_digits:5', "role" => 'required|in:admin,editor,viewer', ...