React (Next.js)

https://nextjs.org/docs/getting-started/installation
https://www.tohoho-web.com/ex/nextjs.html

sudo apt install nodejs
sudo apt install npm

node -v
## v18.19.0

npm -v
## 9.2.0

npx create-next-app@latest

What is your project named? ... my-app
Would you like to use TypeScript? ... No / Yes
Would you like to use ESLint? ... No / Yes
Would you like to use Tailwind CSS? ... No / Yes
Would you like to use `src/` directory? ... No / Yes
Would you like to use App Router? (recommended) ... No / Yes
Would you like to customize the default import alias (@/*)? ... No / Yes
Creating a new Next.js app in /home/user/my-app.

Using npm.
Initializing project with template: app-tw

Installing dependencies:
- react
- react-dom
- next

Installing devDependencies:
- typescript
- @types/node
- @types/react
- @types/react-dom
- postcss
- tailwindcss
- eslint
- eslint-config-next

added 357 packages, and audited 358 packages in 15s

133 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
Success! Created my-app at /home/user/my-app

cd my-app

https://stackoverflow.com/questions/69400243/whats-the-difference-between-npm-run-dev-and-npm-run-start-in-next-js

## Development Server
PORT=3000 npm run dev

## Production Server
#npm run build
#PORT=3000 npm run start

http://localhost:3000

https://stackoverflow.com/questions/50947389/nextjs-cannot-find-a-valid-build-in-the-next-directory

## Error: Could not find a production build in the '.next' directory.
## Try building your app with 'next build' before starting the production server.
## https://nextjs.org/docs/messages/production-start-no-build-id

npm run build

## Error: listen EACCES: permission denied 0.0.0.0:80

sudo PORT=80 npm start

https://ui.shadcn.com/docs/installation/next
https://nextjs.org/docs/messages/module-not-found

## Module not found: Can't resolve '@/components/ui/button'
## > 1 | import { Button } from "@/components/ui/button"

npx shadcn@latest init

Preflight checks.
Verifying framework. Found Next.js.
Validating Tailwind CSS.
Validating import alias.
Which style would you like to use? > New York
Which color would you like to use as the base color? > Neutral
Would you like to use CSS variables for theming? ... no / yes
Writing components.json.
Checking registry.
Updating tailwind.config.ts
Updating app/globals.css
Installing dependencies.
Created 1 file:
- lib/utils.ts

Success! Project initialization completed.
You may now add components.

npx shadcn@latest add button

https://www.npmjs.com/package/recharts

## Module not found: Can't resolve 'recharts'
## > 4 | import { Line, LineChart, ResponsiveContainer, Tooltip, XAxis, YAxis } from "recharts"

npm install recharts

React
https://react.dev/

Node.js
https://nodejs.org/

Next.js
https://nextjs.org/