DEV Community: Posen992

How to use Vite to start a React Project

Posen992 — Thu, 15 Feb 2024 14:33:44 +0000

Here are the steps to use Vite to start a React Project:

1. Navigate to the directory where you want to create the project:

Use the cd command in Terminal to navigate to the directory where you want to create the project. For example:

cd path/to/your/directory

2. Create a React project:

In the same directory, run the following command to create a new Vite project with the React template:

npm create vite@latest my-react-app -- --template react

This will create a folder named my-react-app in the current directory and initialize the project inside it.

3. Enter the project directory:

Use the cd command to enter the newly created project directory:

cd my-react-app

4. Install dependencies:

Run the following command in the project directory to install the project dependencies:

npm install

If some errors will occur in this problem, please go to Errors occurred while using Vite

5. Start the development server:

Finally, run the following command to start the Vite development server:

sudo npm run dev

The console shows that the application has started on localhost port 5173, i.e. the address http://localhost:5173/:

By following these steps, you have successfully created and started a new React project in the directory of your choice.

Errors occurred while using Vite

Posen992 — Thu, 15 Feb 2024 14:27:31 +0000

Here are some errors occurred while using Vite.

1. Error when create a new Vite project with the React template:

When running the command npm install, sometimes the terminal displays an error like the one shown in the picture:

Even though the log suggests using this command with --force, the error persists due to a permission issue. The correct way to resolve this error is to use the command with sudo.

Now, the error has been resolved, and the dependency is installed.

How to install Python3 for Mac

Posen992 — Thu, 15 Feb 2024 13:20:53 +0000

Installing Python Environment

1. Optional: Install Python using Homebrew

If you use Homebrew, open the Terminal and run the following command:

  brew install python

2. Or, Directly Download the Installer

Visit the official Python website.
Click on "Downloads."
Choose the latest version of Python.
Download the installer based on your operating system.

3. Run the Installer

Once the download is complete, open the downloaded installer.
Follow the on-screen instructions to complete the installation.

4. Verify the Installation

Open the Terminal.
Type the following command to check if Python is installed:

  python3 --version

If the version information is displayed, the installation was successful.

Congratulations! You have successfully completed the first step in using Python.

How to install the Node.js

Posen992 — Thu, 15 Feb 2024 13:03:51 +0000

Here are the steps to install Node.js on a Mac:

1. Visit the Node.js official website:

Open the [Node.js official website].

2. Choose a version:

The website will display the latest stable version and the long-term support (LTS) version such as below picture. Depending on your needs, select a version. In general, choosing the LTS version is a good option.

3. Run the Node.js installer:

Once the download is complete, run the downloaded installer.

4. Verify the installation:

After installation, you can verify if Node.js and npm were installed successfully by typing the following commands in the Terminal:

node -v
npm -v

If everything is set up correctly, these commands will display the installed versions of Node.js and npm like below picture.

Now, you have successfully installed Node.js. If you need to globally install Node.js modules later on, you can use the npm command.

I hope this helps! Feel free to ask if you have any further questions.