AI CREATORS PROGRAM
Setup on Windows:
1. Installation of Node Js on Windows
Step 1: Download Node.js Installer
Visit the Node.js website: Go to the official Node.js download page:
https://nodejs.org/
Choose the appropriate version:
You can choose between the LTS (Long Term Support) version or the
Current version. The LTS version is recommended for most users as
it's more stable.
Click on the Windows installer (.msi file) for your system architecture
(32-bit or 64-bit).
Step 2: Run the Installer
Locate the downloaded file: Once the download is complete, locate
the .msi file in your Downloads folder or the location where you
saved it.
Run the installer: Double-click the .msi file to start the installation
process.
Step 3: Installation Process
Welcome Screen: You’ll be greeted with a welcome screen. Click
Next to proceed.
License Agreement: Read the license agreement, select the checkbox
to accept the terms, and then click Next.
Destination Folder: Choose the installation path or leave it as
default, then click Next.
Custom Setup: You’ll be given the option to install additional tools.
Make sure the boxes for "Node.js runtime," "npm package
manager," and "Add to PATH" are checked. Click Next.
Ready to Install: Review your settings and click Install to begin the
installation process.
Complete the Installation: Once the installation is complete, click
Finish to exit the installer.
Step 4: Verify the Installation
Open Command Prompt: Press Win + R, type cmd, and hit Enter.
Check Node.js version: Type node -v and press Enter. This command
will display the installed Node.js version.
Check npm version: Type npm -v and press Enter. This command will
display the installed npm version.
2. Introduction to ReactJS and create-react-app
● ReactJS: A JavaScript library for building user
interfaces.
● create-react-app: A tool that sets up a new React
project with a default configuration.
3. Setting up a Basic ReactJS Project using create-react-app on
Windows
Prerequisites
Node.js and npm installed: Ensure that Node.js and npm are
installed on your system. You can verify this by running the following
commands in Command Prompt:
Step 1: Open Command Prompt or PowerShell
Press Win + R, type cmd, and press Enter to open Command Prompt.
Alternatively, you can use PowerShell.
Step 2: Install create-react-app
To install create-react-app globally, run the following command:
Step 3: Create a New React Application
Navigate to your projects folder:
Replace path\to\your\projects\folder with the path where you
want to create your new React project.
Create a new React app:
Replace my-react-app with your desired project name. This will
create a new folder named my-react-app and set up the React
project inside it.
Step 4: Navigate into Your Project Directory
Change into the project directory:
Step 5: Start the Development Server
Start the development server with the following command:
This will start the development server and open your React
application in the default web browser. The application will be
running at http://localhost:3000.
Step 6: Explore the Project Structure
After running create-react-app, your project structure will look
something like this:
Step 7: Make Changes and See Live Updates
You can edit files inside the src folder, such as App.js, and save your
changes. The development server will automatically reload and show
your changes in the browser.
Step 8: Build the Project for Production
When you are ready to deploy your application, run:
Step 9: Additional Tools (Optional)
Visual Studio Code: A lightweight code editor with great support for
JavaScript and React.
ESLint and Prettier: For code linting and formatting.
4. Deploying Your React App on Windows
Deployment Options:
○ GitHub Pages: Deploy using gh-pages.
○ Netlify: Drag and drop the build folder or connect a GitHub repo.
○ Vercel: Integrate with your GitHub repo for deployment.
Installation of Node Js on Linux:
1. Using NodeSource (recommended)
This method ensures you get the latest stable version of Node.js.
Update your package index:
Install prerequisites:
Download and install the NodeSource PPA (replace setup_16.x with
the version you want, e.g., setup_18.x for Node.js 18):
Install Node.js:
(Optional) Install Specific Version Using Node Version
Manager (NVM):
● Install NVM:
Step 2: Verify Installation
Check Node.js Version:
Check npm Version:
2. Introduction to ReactJS and create-react-app
● ReactJS: A JavaScript library for building user interfaces.
Install npm:
● create-react-app: A tool that sets up a new React project
with a default configuration.
3. Setting up a Basic ReactJS Project using create-react-app on Linux
Step 1: Install create-react-app Globally (Optional)
Step 3: Navigate to the Project Directory
● Change Directory:
Step 4: Run the Development Server
● Start the Server:
This should automatically open your default browser with the starter
React app loaded!
Step 5: Editing the React Project
Open the Project in an Editor: Use an editor like Visual Studio Code,
Sublime Text or Vim. Open src/App.js to start modifying the code.
Step 6: Build for Production
Install npm:
● Create a Production Build:
4. Deploying Your React App on Linux
Deployment Options:
○ GitHub Pages: Deploy using gh-pages.
○ Netlify: Drag and drop the build folder or connect a GitHub repo.
○ Vercel: Integrate with your GitHub repo for deployment.
Installation of VS Codium on Windows and Linux:
VS Codium is a free, open-source build of Visual Studio Code, without
the Microsoft branding and telemetry. Here's how you can install it
on both Windows and Linux:
Installation on Windows:
1. Download the Installer:
Visit the VS Codium website.
Click on the "Windows 64" or "Windows 32" download link
under the "Windows" section.
2. Run the Installer:
Once downloaded, open the installer file (VSCodium-win32-
x64-<version>.exe).
Follow the installation prompts.
3. Launch VS Codium:
After installation, you can launch it from the Start menu or by
searching for "VS Codium."
Installation on Linux:
For Debian/Ubuntu-based distributions:
Add the GPG Key and Repository:
Copy code
wget -qO - https://gitlab.com/paulcarroty/vscodium-deb-rpm-
repo/raw/master/pub.gpg | sudo apt-key add -
echo 'deb [signed-by=/usr/share/keyrings/vscodium-archive-
keyring.gpg] https://deb.vscodium.com/ codium main' | sudo tee
/etc/apt/sources.list.d/vscodium.list
sudo apt update
Install VS Codium:
For Fedora/RHEL/CentOS:
Add the Repository:
Copy code
sudo rpmkeys --import https://gitlab.com/paulcarroty/vscodium-
deb-rpm-repo/raw/master/pub.gpg
sudo wget https://gitlab.com/paulcarroty/vscodium-deb-rpm-
repo/raw/master/vscodium.repo -O
/etc/yum.repos.d/vscodium.repo
Install VS Codium:
For Arch Linux:
Using the AUR:
If you don't have yay installed, you can install it or use another
AUR helper.
Alternative Installation Methods:
Flatpak (for Linux):
Snap (for Linux):
After installation, you can launch VS Codium from your application
menu or via the terminal using the codium command.
