Termux React Commands

Install Node.js

pkg install nodejs

Check Versions

node -v
npm -v

Vite + React (Recommended)

Vite is fast, lightweight, and supports hot reloading

npm create vite@latest <projectname>

cd <projectname>
npm install

npm create vite@latest

• Framework: React
• Variant: JavaScript or TypeScript

npm install

Go to your project folder and install dependencies

Create React App (CRA)

Slightly heavier but works similarly

npx create-react-app myapp
cd myapp
npm install

Vite + React

npm run dev

npm run dev &

http://localhost:5173

npm run dev

• http://localhost:5173
  （Default port is 5173）
• Stop with: Ctrl + C

npm run dev &

• Run in background
• Stop with: jobs → fg → Ctrl+C or kill PID

npm run dev -- --host

npm run dev -- --host -port <port>

ip addr

http://192.168.x.x:5173

CRA

npm start

npm start &

http://localhost:3000

npm start

• http://localhost:3000
  （Default port is 3000）
• Stop with: Ctrl + C

npm run dev &

• Run in background
• Stop with: jobs → fg → Ctrl+C or kill PID

HOST=0.0.0.0 npm start

HOST=0.0.0.0 PORT=<port> npm start

ip addr

http://192.168.x.x:3000

Vite + React

npm run build

npm run preview

http://localhost:4173

npm run build

By default, Vite will create a dist/ folder with all static files

npm run preview

• Runs a local server to preview the production build
• http://localhost:4173 (Vite default)

CRA

npm run build

npm run preview

http://localhost:4173

npm run build

Generates a build/ folder with production files

npm install -g serve

serve -s build

http://localhost:3000

Install gh-pages

Inside your project folder:

npm install gh-pages --save-dev

Configure vite.config.js

nano vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  base: '/github-repo-name/'
})

• Add base: '/repo-name/'

Update package.json

nano package.json

"homepage": "https://your-username.github.io/repo-name",

"scripts": {
  "dev": "vite",
  "build": "vite build",
  "preview": "vite preview",
  "predeploy": "npm run build",
  "deploy": "gh-pages -d dist"
}

Push To main Branch

For source code backup and version control

git init
git remote add origin URL
git branch -M main

git add .
git commit -m "push to main"
git pull origin main --rebase
git push -u origin main

Deploy

Push the built dist folder to the gh-pages branch

npm run deploy

• Create a gh-pages branch
• Upload the dist folder to it

Enable GitHub Pages

Repo Settings → Pages → Branch → gh-pages → Save

Next Time

git add .
git commit -m "update"
git pull
git push
npm run deploy

Configure vite.config.js

nano vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  base: '/github-repo-name/'
})

• Add base: '/repo-name/'

Enable GitHub Pages

Repo Settings → Pages → Source → GitHub Actions → Save

Create GitHub Actions Workflow

mkdir -p .github/workflows
nano .github/workflows/deploy.yml

name: Deploy to GitHub Pages

on:
  push:
    branches:
      - main

permissions:
  contents: read
  pages: write
  id-token: write

concurrency:
  group: "pages"
  cancel-in-progress: true

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4

      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: npm

      - name: Install dependencies
        run: npm install

      - name: Build
        run: npm run build

      - name: Upload artifact
        uses: actions/upload-pages-artifact@v3
        with:
          path: dist

  deploy:
    needs: build
    runs-on: ubuntu-latest
    environment:
      name: github-pages
    steps:
      - name: Deploy
        uses: actions/deploy-pages@v4

Push To GitHub

git init
git remote add origin URL
git branch -M main

git add .
git commit -m "push to main"
git pull origin main --rebase
git push -u origin main

git add .
git commit -m "update"
git pull
git push