\n \n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 116/src/App.css",
"content": "#root {\n max-width: 1280px;\n margin: 0 auto;\n padding: 2rem;\n text-align: center;\n}\n\n.logo {\n height: 6em;\n padding: 1.5em;\n will-change: filter;\n transition: filter 300ms;\n}\n.logo:hover {\n filter: drop-shadow(0 0 2em #646cffaa);\n}\n.logo.react:hover {\n filter: drop-shadow(0 0 2em #61dafbaa);\n}\n\n@keyframes logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n@media (prefers-reduced-motion: no-preference) {\n a:nth-of-type(2) .logo {\n animation: logo-spin infinite 20s linear;\n }\n}\n\n.card {\n padding: 2em;\n}\n\n.read-the-docs {\n color: #888;\n}\n"
},
{
"path": "Video 116/src/App.jsx",
"content": "import { useState } from 'react'\nimport reactLogo from './assets/react.svg'\nimport viteLogo from '/vite.svg'\nimport './App.css'\nimport Navbar from './components/Navbar'\nimport { counterContext } from './context/context'\n\nfunction App() {\n const [count, setCount] = useState(0)\n\n return (\n <>\n \n Vite + React \n \n
setCount((count) => count + 1)}>\n count is {count}\n \n
\n Edit src/App.jsx and save to test HMR\n
\n
\n Click on the Vite and React logos to learn more\n
\n \n \n )\n}\n\nexport default App\n"
},
{
"path": "Video 116/src/components/Button.jsx",
"content": "import React, {useContext} from 'react'\nimport Component1 from './Component1'\nimport { counterContext } from '../context/context'\n\nconst Button = () => {\n const value = useContext(counterContext)\n return (\n \n value.setCount((count) => count + 1)}> \n
\n )\n}\n\nexport default Button\n"
},
{
"path": "Video 116/src/components/Component1.jsx",
"content": "import React, { useContext } from 'react'\nimport { counterContext } from '../context/context'\n\n\nconst Component1 = () => {\n const value = useContext(counterContext)\n return (\n \n {value.count}\n
\n )\n}\n\nexport default Component1\n"
},
{
"path": "Video 116/src/components/Navbar.jsx",
"content": "import React from 'react'\nimport Button from './Button'\n\nconst Navbar = () => {\n return (\n <>\n \n Navbar\n
\n \n ,\n)\n"
},
{
"path": "Video 116/vite.config.js",
"content": "import { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\n\n// https://vitejs.dev/config/\nexport default defineConfig({\n plugins: [react()],\n})\n"
},
{
"path": "Video 118/.eslintrc.cjs",
"content": "module.exports = {\n root: true,\n env: { browser: true, es2020: true },\n extends: [\n 'eslint:recommended',\n 'plugin:react/recommended',\n 'plugin:react/jsx-runtime',\n 'plugin:react-hooks/recommended',\n ],\n ignorePatterns: ['dist', '.eslintrc.cjs'],\n parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },\n settings: { react: { version: '18.2' } },\n plugins: ['react-refresh'],\n rules: {\n 'react/jsx-no-target-blank': 'off',\n 'react-refresh/only-export-components': [\n 'warn',\n { allowConstantExport: true },\n ],\n },\n}\n"
},
{
"path": "Video 118/.gitignore",
"content": "# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\npnpm-debug.log*\nlerna-debug.log*\n\nnode_modules\ndist\ndist-ssr\n*.local\n\n# Editor directories and files\n.vscode/*\n!.vscode/extensions.json\n.idea\n.DS_Store\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n*.sw?\n"
},
{
"path": "Video 118/README.md",
"content": "# React + Vite\n\nThis template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.\n\nCurrently, two official plugins are available:\n\n- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh\n- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh\n"
},
{
"path": "Video 118/index.html",
"content": "\n\n \n Vite + React \n \n \n
\n \n \n\n"
},
{
"path": "Video 118/package.json",
"content": "{\n \"name\": \"video-118\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vite build\",\n \"lint\": \"eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0\",\n \"preview\": \"vite preview\"\n },\n \"dependencies\": {\n \"react\": \"^18.2.0\",\n \"react-dom\": \"^18.2.0\"\n },\n \"devDependencies\": {\n \"@types/react\": \"^18.2.55\",\n \"@types/react-dom\": \"^18.2.19\",\n \"@vitejs/plugin-react\": \"^4.2.1\",\n \"eslint\": \"^8.56.0\",\n \"eslint-plugin-react\": \"^7.33.2\",\n \"eslint-plugin-react-hooks\": \"^4.6.0\",\n \"eslint-plugin-react-refresh\": \"^0.4.5\",\n \"vite\": \"^5.1.0\"\n }\n}\n"
},
{
"path": "Video 118/src/App.css",
"content": "#root {\n max-width: 1280px;\n margin: 0 auto;\n padding: 2rem;\n text-align: center;\n}\n\n.logo {\n height: 6em;\n padding: 1.5em;\n will-change: filter;\n transition: filter 300ms;\n}\n.logo:hover {\n filter: drop-shadow(0 0 2em #646cffaa);\n}\n.logo.react:hover {\n filter: drop-shadow(0 0 2em #61dafbaa);\n}\n\n@keyframes logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n@media (prefers-reduced-motion: no-preference) {\n a:nth-of-type(2) .logo {\n animation: logo-spin infinite 20s linear;\n }\n}\n\n.card {\n padding: 2em;\n}\n\n.read-the-docs {\n color: #888;\n}\n"
},
{
"path": "Video 118/src/App.jsx",
"content": "import { useState, useCallback } from 'react'\nimport reactLogo from './assets/react.svg'\nimport viteLogo from '/vite.svg'\nimport './App.css'\nimport Navbar from './components/Navbar'\n\nfunction App() {\n const [count, setCount] = useState(0)\n const [count2, setCount2] = useState(0)\n const [adjective, setAdjective] = useState(\"good\")\n\n // const getAdjective = () => {\n // return \"another\" + count\n // }\n\n const getAdjective = useCallback(() => {\n return \"another\" + count\n },[count] )\n\n\n\n return (\n <>\n Vite + React \n \n
setCount((count) => count + 1)}>\n count is {count}\n \n
\n Edit src/App.jsx and save to test HMR\n
\n
\n Click on the Vite and React logos to learn more\n
\n \n )\n}\n\nexport default App\n"
},
{
"path": "Video 118/src/components/Navbar.jsx",
"content": "import React from 'react'\nimport { memo } from 'react'\n\nconst Navbar = ({adjective, getAdjective}) => {\n console.log(\"Navbar is rendered\")\n return (\n \n I am a {adjective} Navbar\n {getAdjective()}}>{getAdjective()} \n
\n )\n}\n\nexport default memo(Navbar)\n"
},
{
"path": "Video 118/src/index.css",
"content": ":root {\n font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;\n line-height: 1.5;\n font-weight: 400;\n\n color-scheme: light dark;\n color: rgba(255, 255, 255, 0.87);\n background-color: #242424;\n\n font-synthesis: none;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\na {\n font-weight: 500;\n color: #646cff;\n text-decoration: inherit;\n}\na:hover {\n color: #535bf2;\n}\n\nbody {\n margin: 0;\n display: flex;\n place-items: center;\n min-width: 320px;\n min-height: 100vh;\n}\n\nh1 {\n font-size: 3.2em;\n line-height: 1.1;\n}\n\nbutton {\n border-radius: 8px;\n border: 1px solid transparent;\n padding: 0.6em 1.2em;\n font-size: 1em;\n font-weight: 500;\n font-family: inherit;\n background-color: #1a1a1a;\n cursor: pointer;\n transition: border-color 0.25s;\n}\nbutton:hover {\n border-color: #646cff;\n}\nbutton:focus,\nbutton:focus-visible {\n outline: 4px auto -webkit-focus-ring-color;\n}\n\n@media (prefers-color-scheme: light) {\n :root {\n color: #213547;\n background-color: #ffffff;\n }\n a:hover {\n color: #747bff;\n }\n button {\n background-color: #f9f9f9;\n }\n}\n"
},
{
"path": "Video 118/src/main.jsx",
"content": "import React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App.jsx'\nimport './index.css'\n\nReactDOM.createRoot(document.getElementById('root')).render(\n \n Vite + React \n \n \n
\n \n \n\n"
},
{
"path": "Video 119/package.json",
"content": "{\n \"name\": \"video-119\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vite build\",\n \"lint\": \"eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0\",\n \"preview\": \"vite preview\"\n },\n \"dependencies\": {\n \"body-parser\": \"^1.20.2\",\n \"cors\": \"^2.8.5\",\n \"express\": \"^4.18.2\",\n \"react\": \"^18.2.0\",\n \"react-dom\": \"^18.2.0\",\n \"react-hook-form\": \"^7.50.1\"\n },\n \"devDependencies\": {\n \"@types/react\": \"^18.2.55\",\n \"@types/react-dom\": \"^18.2.19\",\n \"@vitejs/plugin-react\": \"^4.2.1\",\n \"eslint\": \"^8.56.0\",\n \"eslint-plugin-react\": \"^7.33.2\",\n \"eslint-plugin-react-hooks\": \"^4.6.0\",\n \"eslint-plugin-react-refresh\": \"^0.4.5\",\n \"vite\": \"^5.1.0\"\n }\n}\n"
},
{
"path": "Video 119/src/App.css",
"content": "#root {\n max-width: 1280px;\n margin: 0 auto;\n padding: 2rem;\n text-align: center;\n}\n\n.red{\n color: red;\n font-size: 12px;\n}\n\n.logo {\n height: 6em;\n padding: 1.5em;\n will-change: filter;\n transition: filter 300ms;\n}\n.logo:hover {\n filter: drop-shadow(0 0 2em #646cffaa);\n}\n.logo.react:hover {\n filter: drop-shadow(0 0 2em #61dafbaa);\n}\n\n@keyframes logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n@media (prefers-reduced-motion: no-preference) {\n a:nth-of-type(2) .logo {\n animation: logo-spin infinite 20s linear;\n }\n}\n\n.card {\n padding: 2em;\n}\n\n.read-the-docs {\n color: #888;\n}\n"
},
{
"path": "Video 119/src/App.jsx",
"content": "import { useState } from 'react' \nimport './App.css'\nimport { useForm } from \"react-hook-form\"\n \n \n\nfunction App() { \n const {\n register,\n handleSubmit,\n setError, \n formState: { errors, isSubmitting },\n } = useForm();\n\n const delay = (d)=>{\n return new Promise((resolve, reject)=>{\n setTimeout(() => {\n resolve()\n }, d * 1000);\n })\n }\n\n const onSubmit = async (data) => {\n // await delay(2) // simulating network delay\n let r = await fetch(\"http://localhost:3000/\", {method: \"POST\", headers: {\n \"Content-Type\": \"application/json\", \n }, body: JSON.stringify(data)})\n let res = await r.text()\n console.log(data, res)\n // if(data.username !== \"shubham\"){\n // setError(\"myform\", {message: \"Your form is not in good order because credentials are invalid\"})\n // }\n // if(data.username === \"rohan\"){\n // setError(\"blocked\", {message: \"Sorry this user is blocked\"})\n // }\n }\n\n return (\n <> \n {isSubmitting && Loading...
}\n \n \n )\n}\n\nexport default App\n"
},
{
"path": "Video 119/src/index.css",
"content": ":root {\n font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;\n line-height: 1.5;\n font-weight: 400;\n\n color-scheme: light dark;\n color: rgba(255, 255, 255, 0.87);\n background-color: #242424;\n\n font-synthesis: none;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\na {\n font-weight: 500;\n color: #646cff;\n text-decoration: inherit;\n}\na:hover {\n color: #535bf2;\n}\n\nbody {\n margin: 0;\n display: flex;\n place-items: center;\n min-width: 320px;\n min-height: 100vh;\n}\n\nh1 {\n font-size: 3.2em;\n line-height: 1.1;\n}\n\nbutton {\n border-radius: 8px;\n border: 1px solid transparent;\n padding: 0.6em 1.2em;\n font-size: 1em;\n font-weight: 500;\n font-family: inherit;\n background-color: #1a1a1a;\n cursor: pointer;\n transition: border-color 0.25s;\n}\nbutton:hover {\n border-color: #646cff;\n}\nbutton:focus,\nbutton:focus-visible {\n outline: 4px auto -webkit-focus-ring-color;\n}\n\n@media (prefers-color-scheme: light) {\n :root {\n color: #213547;\n background-color: #ffffff;\n }\n a:hover {\n color: #747bff;\n }\n button {\n background-color: #f9f9f9;\n }\n}\n"
},
{
"path": "Video 119/src/main.jsx",
"content": "import React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App.jsx'\nimport './index.css'\n\nReactDOM.createRoot(document.getElementById('root')).render(\n \n ,\n)\n"
},
{
"path": "Video 119/vite.config.js",
"content": "import { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\n\n// https://vitejs.dev/config/\nexport default defineConfig({\n plugins: [react()],\n})\n"
},
{
"path": "Video 12/index.html",
"content": "\n\n\n Document \n\n\n \n\n\n\n"
},
{
"path": "Video 120/.eslintrc.cjs",
"content": "module.exports = {\n root: true,\n env: { browser: true, es2020: true },\n extends: [\n 'eslint:recommended',\n 'plugin:react/recommended',\n 'plugin:react/jsx-runtime',\n 'plugin:react-hooks/recommended',\n ],\n ignorePatterns: ['dist', '.eslintrc.cjs'],\n parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },\n settings: { react: { version: '18.2' } },\n plugins: ['react-refresh'],\n rules: {\n 'react/jsx-no-target-blank': 'off',\n 'react-refresh/only-export-components': [\n 'warn',\n { allowConstantExport: true },\n ],\n },\n}\n"
},
{
"path": "Video 120/.gitignore",
"content": "# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\npnpm-debug.log*\nlerna-debug.log*\n\nnode_modules\ndist\ndist-ssr\n*.local\n\n# Editor directories and files\n.vscode/*\n!.vscode/extensions.json\n.idea\n.DS_Store\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n*.sw?\n"
},
{
"path": "Video 120/README.md",
"content": "# React + Vite\n\nThis template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.\n\nCurrently, two official plugins are available:\n\n- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh\n- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh\n"
},
{
"path": "Video 120/index.html",
"content": "\n\n \n Vite + React \n \n \n
\n \n \n\n"
},
{
"path": "Video 120/package.json",
"content": "{\n \"name\": \"video-120\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vite build\",\n \"lint\": \"eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0\",\n \"preview\": \"vite preview\"\n },\n \"dependencies\": {\n \"@reduxjs/toolkit\": \"^2.2.1\",\n \"react\": \"^18.2.0\",\n \"react-dom\": \"^18.2.0\",\n \"react-redux\": \"^9.1.0\"\n },\n \"devDependencies\": {\n \"@types/react\": \"^18.2.56\",\n \"@types/react-dom\": \"^18.2.19\",\n \"@vitejs/plugin-react\": \"^4.2.1\",\n \"eslint\": \"^8.56.0\",\n \"eslint-plugin-react\": \"^7.33.2\",\n \"eslint-plugin-react-hooks\": \"^4.6.0\",\n \"eslint-plugin-react-refresh\": \"^0.4.5\",\n \"vite\": \"^5.1.4\"\n }\n}\n"
},
{
"path": "Video 120/src/App.css",
"content": "#root {\n max-width: 1280px;\n margin: 0 auto;\n padding: 2rem;\n text-align: center;\n}\n\n.logo {\n height: 6em;\n padding: 1.5em;\n will-change: filter;\n transition: filter 300ms;\n}\n.logo:hover {\n filter: drop-shadow(0 0 2em #646cffaa);\n}\n.logo.react:hover {\n filter: drop-shadow(0 0 2em #61dafbaa);\n}\n\n@keyframes logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n@media (prefers-reduced-motion: no-preference) {\n a:nth-of-type(2) .logo {\n animation: logo-spin infinite 20s linear;\n }\n}\n\n.card {\n padding: 2em;\n}\n\n.read-the-docs {\n color: #888;\n}\n"
},
{
"path": "Video 120/src/App.jsx",
"content": "import { useState } from 'react'\nimport reactLogo from './assets/react.svg'\nimport viteLogo from '/vite.svg'\nimport './App.css'\nimport Navbar from './components/Navbar'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { decrement, increment, multiply } from './redux/counter/counterSlice'\n\nfunction App() { \n const count = useSelector((state) => state.counter.value)\n const dispatch = useDispatch()\n\n return (\n <>\n \n dispatch(decrement())}>- \n Currently count is {count}\n dispatch(increment())}>+ \n dispatch(multiply())}>* \n
\n\n \n )\n}\n\nexport default App\n"
},
{
"path": "Video 120/src/components/Navbar.jsx",
"content": "import React from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\n\nconst Navbar = () => {\n const count = useSelector((state) => state.counter.value)\n\n return (\n \n I am a navbar and counter is {count}\n
\n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 120/src/index.css",
"content": ":root {\n font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;\n line-height: 1.5;\n font-weight: 400;\n\n color-scheme: light dark;\n color: rgba(255, 255, 255, 0.87);\n background-color: #242424;\n\n font-synthesis: none;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\na {\n font-weight: 500;\n color: #646cff;\n text-decoration: inherit;\n}\na:hover {\n color: #535bf2;\n}\n\nbody {\n margin: 0;\n display: flex;\n place-items: center;\n min-width: 320px;\n min-height: 100vh;\n}\n\nh1 {\n font-size: 3.2em;\n line-height: 1.1;\n}\n\nbutton {\n border-radius: 8px;\n border: 1px solid transparent;\n padding: 0.6em 1.2em;\n font-size: 1em;\n font-weight: 500;\n font-family: inherit;\n background-color: #1a1a1a;\n cursor: pointer;\n transition: border-color 0.25s;\n}\nbutton:hover {\n border-color: #646cff;\n}\nbutton:focus,\nbutton:focus-visible {\n outline: 4px auto -webkit-focus-ring-color;\n}\n\n@media (prefers-color-scheme: light) {\n :root {\n color: #213547;\n background-color: #ffffff;\n }\n a:hover {\n color: #747bff;\n }\n button {\n background-color: #f9f9f9;\n }\n}\n"
},
{
"path": "Video 120/src/main.jsx",
"content": "import React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App.jsx'\nimport './index.css'\nimport {store} from \"./redux/store.js\"\nimport { Provider } from 'react-redux'\n\nReactDOM.createRoot(document.getElementById('root')).render(\n \n \n \n ,\n)\n"
},
{
"path": "Video 120/src/redux/counter/counterSlice.js",
"content": "import { createSlice } from '@reduxjs/toolkit'\n\nconst initialState = {\n value: 0,\n}\n\nexport const counterSlice = createSlice({\n name: 'counter',\n initialState,\n reducers: {\n increment: (state) => {\n // Redux Toolkit allows us to write \"mutating\" logic in reducers. It\n // doesn't actually mutate the state because it uses the Immer library,\n // which detects changes to a \"draft state\" and produces a brand new\n // immutable state based off those changes\n state.value += 1\n },\n decrement: (state) => {\n state.value -= 1\n },\n incrementByAmount: (state, action) => {\n state.value += action.payload\n },\n multiply: (state)=>{\n state.value *=2\n }\n },\n})\n\n// Action creators are generated for each case reducer function\nexport const { increment, decrement, incrementByAmount, multiply } = counterSlice.actions\n\nexport default counterSlice.reducer"
},
{
"path": "Video 120/src/redux/store.js",
"content": "import { configureStore } from '@reduxjs/toolkit'\nimport counterReducer from \"./counter/counterSlice\"\n\nexport const store = configureStore({\n reducer: {\n counter: counterReducer,\n },\n})\n\n// https://stackoverflow.com/questions/54385323/what-is-a-difference-between-action-reducer-and-store-in-redux"
},
{
"path": "Video 120/vite.config.js",
"content": "import { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\n\n// https://vitejs.dev/config/\nexport default defineConfig({\n plugins: [react()],\n})\n"
},
{
"path": "Video 121/first/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 121/first/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 121/first/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 121/first/app/about/page.js",
"content": "import React from 'react'\n\nconst page = () => {\n return (\n \n
Problems solved by Next.js \n
\n Full Stack Solution \n File based Routing \n Additional features like router from next/navigation \n Optimized rendering \n \n
\n I am contact\n
\n )\n}\n\nexport default contact\n"
},
{
"path": "Video 121/first/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 121/first/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\nimport Navbar from \"@/component/Navbar\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Blog\",\n description: \"I am a blog\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n \n \n I am navbar\n
\n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 121/first/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 121/first/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 121/first/package.json",
"content": "{\n \"name\": \"first\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 121/first/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 121/first/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 122/my-app/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 122/my-app/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 122/my-app/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 122/my-app/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 122/my-app/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n {children}\n \n );\n}\n"
},
{
"path": "Video 122/my-app/app/page.js",
"content": "// import { useState, useEffect } from \"react\";\nimport fs from \"fs/promises\"\nimport Navbar from \"@/components/Navbar\"\n\nexport default function Home() {\n // const [count, setCount] = useState(0)\n console.log(\"Hey I am harry\")\n let a = fs.readFile(\".gitignore\")\n a.then(e=>{console.log(e.toString())})\n return (\n \n setCount(count + 1)}>Click me */}\n
\n );\n}\n"
},
{
"path": "Video 122/my-app/components/Navbar.js",
"content": "\"use client\"\nimport React from 'react'\n\nconst Navbar = () => {\n return (\n \n navbar\n
\n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 122/my-app/data.json",
"content": "[\n {\n \"userId\": 1,\n \"id\": 1,\n \"title\": \"delectus aut autem\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 2,\n \"title\": \"quis ut nam facilis et officia qui\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 3,\n \"title\": \"fugiat veniam minus\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 4,\n \"title\": \"et porro tempora\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 5,\n \"title\": \"laboriosam mollitia et enim quasi adipisci quia provident illum\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 6,\n \"title\": \"qui ullam ratione quibusdam voluptatem quia omnis\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 7,\n \"title\": \"illo expedita consequatur quia in\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 8,\n \"title\": \"quo adipisci enim quam ut ab\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 9,\n \"title\": \"molestiae perspiciatis ipsa\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 10,\n \"title\": \"illo est ratione doloremque quia maiores aut\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 11,\n \"title\": \"vero rerum temporibus dolor\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 12,\n \"title\": \"ipsa repellendus fugit nisi\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 13,\n \"title\": \"et doloremque nulla\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 14,\n \"title\": \"repellendus sunt dolores architecto voluptatum\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 15,\n \"title\": \"ab voluptatum amet voluptas\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 16,\n \"title\": \"accusamus eos facilis sint et aut voluptatem\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 17,\n \"title\": \"quo laboriosam deleniti aut qui\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 18,\n \"title\": \"dolorum est consequatur ea mollitia in culpa\",\n \"completed\": false\n },\n {\n \"userId\": 1,\n \"id\": 19,\n \"title\": \"molestiae ipsa aut voluptatibus pariatur dolor nihil\",\n \"completed\": true\n },\n {\n \"userId\": 1,\n \"id\": 20,\n \"title\": \"ullam nobis libero sapiente ad optio sint\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 21,\n \"title\": \"suscipit repellat esse quibusdam voluptatem incidunt\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 22,\n \"title\": \"distinctio vitae autem nihil ut molestias quo\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 23,\n \"title\": \"et itaque necessitatibus maxime molestiae qui quas velit\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 24,\n \"title\": \"adipisci non ad dicta qui amet quaerat doloribus ea\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 25,\n \"title\": \"voluptas quo tenetur perspiciatis explicabo natus\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 26,\n \"title\": \"aliquam aut quasi\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 27,\n \"title\": \"veritatis pariatur delectus\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 28,\n \"title\": \"nesciunt totam sit blanditiis sit\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 29,\n \"title\": \"laborum aut in quam\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 30,\n \"title\": \"nemo perspiciatis repellat ut dolor libero commodi blanditiis omnis\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 31,\n \"title\": \"repudiandae totam in est sint facere fuga\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 32,\n \"title\": \"earum doloribus ea doloremque quis\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 33,\n \"title\": \"sint sit aut vero\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 34,\n \"title\": \"porro aut necessitatibus eaque distinctio\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 35,\n \"title\": \"repellendus veritatis molestias dicta incidunt\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 36,\n \"title\": \"excepturi deleniti adipisci voluptatem et neque optio illum ad\",\n \"completed\": true\n },\n {\n \"userId\": 2,\n \"id\": 37,\n \"title\": \"sunt cum tempora\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 38,\n \"title\": \"totam quia non\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 39,\n \"title\": \"doloremque quibusdam asperiores libero corrupti illum qui omnis\",\n \"completed\": false\n },\n {\n \"userId\": 2,\n \"id\": 40,\n \"title\": \"totam atque quo nesciunt\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 41,\n \"title\": \"aliquid amet impedit consequatur aspernatur placeat eaque fugiat suscipit\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 42,\n \"title\": \"rerum perferendis error quia ut eveniet\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 43,\n \"title\": \"tempore ut sint quis recusandae\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 44,\n \"title\": \"cum debitis quis accusamus doloremque ipsa natus sapiente omnis\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 45,\n \"title\": \"velit soluta adipisci molestias reiciendis harum\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 46,\n \"title\": \"vel voluptatem repellat nihil placeat corporis\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 47,\n \"title\": \"nam qui rerum fugiat accusamus\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 48,\n \"title\": \"sit reprehenderit omnis quia\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 49,\n \"title\": \"ut necessitatibus aut maiores debitis officia blanditiis velit et\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 50,\n \"title\": \"cupiditate necessitatibus ullam aut quis dolor voluptate\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 51,\n \"title\": \"distinctio exercitationem ab doloribus\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 52,\n \"title\": \"nesciunt dolorum quis recusandae ad pariatur ratione\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 53,\n \"title\": \"qui labore est occaecati recusandae aliquid quam\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 54,\n \"title\": \"quis et est ut voluptate quam dolor\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 55,\n \"title\": \"voluptatum omnis minima qui occaecati provident nulla voluptatem ratione\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 56,\n \"title\": \"deleniti ea temporibus enim\",\n \"completed\": true\n },\n {\n \"userId\": 3,\n \"id\": 57,\n \"title\": \"pariatur et magnam ea doloribus similique voluptatem rerum quia\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 58,\n \"title\": \"est dicta totam qui explicabo doloribus qui dignissimos\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 59,\n \"title\": \"perspiciatis velit id laborum placeat iusto et aliquam odio\",\n \"completed\": false\n },\n {\n \"userId\": 3,\n \"id\": 60,\n \"title\": \"et sequi qui architecto ut adipisci\",\n \"completed\": true\n },\n {\n \"userId\": 4,\n \"id\": 61,\n \"title\": \"odit optio omnis qui sunt\",\n \"completed\": true\n },\n {\n \"userId\": 4,\n \"id\": 62,\n \"title\": \"et placeat et tempore aspernatur sint numquam\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 63,\n \"title\": \"doloremque aut dolores quidem fuga qui nulla\",\n \"completed\": true\n },\n {\n \"userId\": 4,\n \"id\": 64,\n \"title\": \"voluptas consequatur qui ut quia magnam nemo esse\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 65,\n \"title\": \"fugiat pariatur ratione ut asperiores necessitatibus magni\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 66,\n \"title\": \"rerum eum molestias autem voluptatum sit optio\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 67,\n \"title\": \"quia voluptatibus voluptatem quos similique maiores repellat\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 68,\n \"title\": \"aut id perspiciatis voluptatem iusto\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 69,\n \"title\": \"doloribus sint dolorum ab adipisci itaque dignissimos aliquam suscipit\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 70,\n \"title\": \"ut sequi accusantium et mollitia delectus sunt\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 71,\n \"title\": \"aut velit saepe ullam\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 72,\n \"title\": \"praesentium facilis facere quis harum voluptatibus voluptatem eum\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 73,\n \"title\": \"sint amet quia totam corporis qui exercitationem commodi\",\n \"completed\": true\n },\n {\n \"userId\": 4,\n \"id\": 74,\n \"title\": \"expedita tempore nobis eveniet laborum maiores\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 75,\n \"title\": \"occaecati adipisci est possimus totam\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 76,\n \"title\": \"sequi dolorem sed\",\n \"completed\": true\n },\n {\n \"userId\": 4,\n \"id\": 77,\n \"title\": \"maiores aut nesciunt delectus exercitationem vel assumenda eligendi at\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 78,\n \"title\": \"reiciendis est magnam amet nemo iste recusandae impedit quaerat\",\n \"completed\": false\n },\n {\n \"userId\": 4,\n \"id\": 79,\n \"title\": \"eum ipsa maxime ut\",\n \"completed\": true\n },\n {\n \"userId\": 4,\n \"id\": 80,\n \"title\": \"tempore molestias dolores rerum sequi voluptates ipsum consequatur\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 81,\n \"title\": \"suscipit qui totam\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 82,\n \"title\": \"voluptates eum voluptas et dicta\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 83,\n \"title\": \"quidem at rerum quis ex aut sit quam\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 84,\n \"title\": \"sunt veritatis ut voluptate\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 85,\n \"title\": \"et quia ad iste a\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 86,\n \"title\": \"incidunt ut saepe autem\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 87,\n \"title\": \"laudantium quae eligendi consequatur quia et vero autem\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 88,\n \"title\": \"vitae aut excepturi laboriosam sint aliquam et et accusantium\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 89,\n \"title\": \"sequi ut omnis et\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 90,\n \"title\": \"molestiae nisi accusantium tenetur dolorem et\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 91,\n \"title\": \"nulla quis consequatur saepe qui id expedita\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 92,\n \"title\": \"in omnis laboriosam\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 93,\n \"title\": \"odio iure consequatur molestiae quibusdam necessitatibus quia sint\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 94,\n \"title\": \"facilis modi saepe mollitia\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 95,\n \"title\": \"vel nihil et molestiae iusto assumenda nemo quo ut\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 96,\n \"title\": \"nobis suscipit ducimus enim asperiores voluptas\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 97,\n \"title\": \"dolorum laboriosam eos qui iure aliquam\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 98,\n \"title\": \"debitis accusantium ut quo facilis nihil quis sapiente necessitatibus\",\n \"completed\": true\n },\n {\n \"userId\": 5,\n \"id\": 99,\n \"title\": \"neque voluptates ratione\",\n \"completed\": false\n },\n {\n \"userId\": 5,\n \"id\": 100,\n \"title\": \"excepturi a et neque qui expedita vel voluptate\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 101,\n \"title\": \"explicabo enim cumque porro aperiam occaecati minima\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 102,\n \"title\": \"sed ab consequatur\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 103,\n \"title\": \"non sunt delectus illo nulla tenetur enim omnis\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 104,\n \"title\": \"excepturi non laudantium quo\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 105,\n \"title\": \"totam quia dolorem et illum repellat voluptas optio\",\n \"completed\": true\n },\n {\n \"userId\": 6,\n \"id\": 106,\n \"title\": \"ad illo quis voluptatem temporibus\",\n \"completed\": true\n },\n {\n \"userId\": 6,\n \"id\": 107,\n \"title\": \"praesentium facilis omnis laudantium fugit ad iusto nihil nesciunt\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 108,\n \"title\": \"a eos eaque nihil et exercitationem incidunt delectus\",\n \"completed\": true\n },\n {\n \"userId\": 6,\n \"id\": 109,\n \"title\": \"autem temporibus harum quisquam in culpa\",\n \"completed\": true\n },\n {\n \"userId\": 6,\n \"id\": 110,\n \"title\": \"aut aut ea corporis\",\n \"completed\": true\n },\n {\n \"userId\": 6,\n \"id\": 111,\n \"title\": \"magni accusantium labore et id quis provident\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 112,\n \"title\": \"consectetur impedit quisquam qui deserunt non rerum consequuntur eius\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 113,\n \"title\": \"quia atque aliquam sunt impedit voluptatum rerum assumenda nisi\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 114,\n \"title\": \"cupiditate quos possimus corporis quisquam exercitationem beatae\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 115,\n \"title\": \"sed et ea eum\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 116,\n \"title\": \"ipsa dolores vel facilis ut\",\n \"completed\": true\n },\n {\n \"userId\": 6,\n \"id\": 117,\n \"title\": \"sequi quae est et qui qui eveniet asperiores\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 118,\n \"title\": \"quia modi consequatur vero fugiat\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 119,\n \"title\": \"corporis ducimus ea perspiciatis iste\",\n \"completed\": false\n },\n {\n \"userId\": 6,\n \"id\": 120,\n \"title\": \"dolorem laboriosam vel voluptas et aliquam quasi\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 121,\n \"title\": \"inventore aut nihil minima laudantium hic qui omnis\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 122,\n \"title\": \"provident aut nobis culpa\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 123,\n \"title\": \"esse et quis iste est earum aut impedit\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 124,\n \"title\": \"qui consectetur id\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 125,\n \"title\": \"aut quasi autem iste tempore illum possimus\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 126,\n \"title\": \"ut asperiores perspiciatis veniam ipsum rerum saepe\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 127,\n \"title\": \"voluptatem libero consectetur rerum ut\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 128,\n \"title\": \"eius omnis est qui voluptatem autem\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 129,\n \"title\": \"rerum culpa quis harum\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 130,\n \"title\": \"nulla aliquid eveniet harum laborum libero alias ut unde\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 131,\n \"title\": \"qui ea incidunt quis\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 132,\n \"title\": \"qui molestiae voluptatibus velit iure harum quisquam\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 133,\n \"title\": \"et labore eos enim rerum consequatur sunt\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 134,\n \"title\": \"molestiae doloribus et laborum quod ea\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 135,\n \"title\": \"facere ipsa nam eum voluptates reiciendis vero qui\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 136,\n \"title\": \"asperiores illo tempora fuga sed ut quasi adipisci\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 137,\n \"title\": \"qui sit non\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 138,\n \"title\": \"placeat minima consequatur rem qui ut\",\n \"completed\": true\n },\n {\n \"userId\": 7,\n \"id\": 139,\n \"title\": \"consequatur doloribus id possimus voluptas a voluptatem\",\n \"completed\": false\n },\n {\n \"userId\": 7,\n \"id\": 140,\n \"title\": \"aut consectetur in blanditiis deserunt quia sed laboriosam\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 141,\n \"title\": \"explicabo consectetur debitis voluptates quas quae culpa rerum non\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 142,\n \"title\": \"maiores accusantium architecto necessitatibus reiciendis ea aut\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 143,\n \"title\": \"eum non recusandae cupiditate animi\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 144,\n \"title\": \"ut eum exercitationem sint\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 145,\n \"title\": \"beatae qui ullam incidunt voluptatem non nisi aliquam\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 146,\n \"title\": \"molestiae suscipit ratione nihil odio libero impedit vero totam\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 147,\n \"title\": \"eum itaque quod reprehenderit et facilis dolor autem ut\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 148,\n \"title\": \"esse quas et quo quasi exercitationem\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 149,\n \"title\": \"animi voluptas quod perferendis est\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 150,\n \"title\": \"eos amet tempore laudantium fugit a\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 151,\n \"title\": \"accusamus adipisci dicta qui quo ea explicabo sed vero\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 152,\n \"title\": \"odit eligendi recusandae doloremque cumque non\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 153,\n \"title\": \"ea aperiam consequatur qui repellat eos\",\n \"completed\": false\n },\n {\n \"userId\": 8,\n \"id\": 154,\n \"title\": \"rerum non ex sapiente\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 155,\n \"title\": \"voluptatem nobis consequatur et assumenda magnam\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 156,\n \"title\": \"nam quia quia nulla repellat assumenda quibusdam sit nobis\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 157,\n \"title\": \"dolorem veniam quisquam deserunt repellendus\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 158,\n \"title\": \"debitis vitae delectus et harum accusamus aut deleniti a\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 159,\n \"title\": \"debitis adipisci quibusdam aliquam sed dolore ea praesentium nobis\",\n \"completed\": true\n },\n {\n \"userId\": 8,\n \"id\": 160,\n \"title\": \"et praesentium aliquam est\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 161,\n \"title\": \"ex hic consequuntur earum omnis alias ut occaecati culpa\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 162,\n \"title\": \"omnis laboriosam molestias animi sunt dolore\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 163,\n \"title\": \"natus corrupti maxime laudantium et voluptatem laboriosam odit\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 164,\n \"title\": \"reprehenderit quos aut aut consequatur est sed\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 165,\n \"title\": \"fugiat perferendis sed aut quidem\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 166,\n \"title\": \"quos quo possimus suscipit minima ut\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 167,\n \"title\": \"et quis minus quo a asperiores molestiae\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 168,\n \"title\": \"recusandae quia qui sunt libero\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 169,\n \"title\": \"ea odio perferendis officiis\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 170,\n \"title\": \"quisquam aliquam quia doloribus aut\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 171,\n \"title\": \"fugiat aut voluptatibus corrupti deleniti velit iste odio\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 172,\n \"title\": \"et provident amet rerum consectetur et voluptatum\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 173,\n \"title\": \"harum ad aperiam quis\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 174,\n \"title\": \"similique aut quo\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 175,\n \"title\": \"laudantium eius officia perferendis provident perspiciatis asperiores\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 176,\n \"title\": \"magni soluta corrupti ut maiores rem quidem\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 177,\n \"title\": \"et placeat temporibus voluptas est tempora quos quibusdam\",\n \"completed\": false\n },\n {\n \"userId\": 9,\n \"id\": 178,\n \"title\": \"nesciunt itaque commodi tempore\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 179,\n \"title\": \"omnis consequuntur cupiditate impedit itaque ipsam quo\",\n \"completed\": true\n },\n {\n \"userId\": 9,\n \"id\": 180,\n \"title\": \"debitis nisi et dolorem repellat et\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 181,\n \"title\": \"ut cupiditate sequi aliquam fuga maiores\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 182,\n \"title\": \"inventore saepe cumque et aut illum enim\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 183,\n \"title\": \"omnis nulla eum aliquam distinctio\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 184,\n \"title\": \"molestias modi perferendis perspiciatis\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 185,\n \"title\": \"voluptates dignissimos sed doloribus animi quaerat aut\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 186,\n \"title\": \"explicabo odio est et\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 187,\n \"title\": \"consequuntur animi possimus\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 188,\n \"title\": \"vel non beatae est\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 189,\n \"title\": \"culpa eius et voluptatem et\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 190,\n \"title\": \"accusamus sint iusto et voluptatem exercitationem\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 191,\n \"title\": \"temporibus atque distinctio omnis eius impedit tempore molestias pariatur\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 192,\n \"title\": \"ut quas possimus exercitationem sint voluptates\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 193,\n \"title\": \"rerum debitis voluptatem qui eveniet tempora distinctio a\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 194,\n \"title\": \"sed ut vero sit molestiae\",\n \"completed\": false\n },\n {\n \"userId\": 10,\n \"id\": 195,\n \"title\": \"rerum ex veniam mollitia voluptatibus pariatur\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 196,\n \"title\": \"consequuntur aut ut fugit similique\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 197,\n \"title\": \"dignissimos quo nobis earum saepe\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 198,\n \"title\": \"quis eius est sint explicabo\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 199,\n \"title\": \"numquam repellendus a magnam\",\n \"completed\": true\n },\n {\n \"userId\": 10,\n \"id\": 200,\n \"title\": \"ipsam aperiam voluptates qui\",\n \"completed\": false\n }\n ]"
},
{
"path": "Video 122/my-app/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 122/my-app/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 122/my-app/package.json",
"content": "{\n \"name\": \"my-app\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 122/my-app/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 122/my-app/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 123/comps/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 123/comps/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 123/comps/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 123/comps/app/about/page.js",
"content": "import React from 'react'\nimport Script from 'next/script'\n\nconst page = () => {\n return (\n \n \n I am about\n
\n )\n}\n\nexport default page\n\nexport const metadata = {\n title: 'About - facebook.com',\n description: 'facebook is a social media platform',\n}\n"
},
{
"path": "Video 123/comps/app/contact/page.js",
"content": "import React from 'react'\n\nconst Contact = () => {\n return (\n \n I am contact\n
\n )\n}\n\nexport default Contact\n"
},
{
"path": "Video 123/comps/app/footer/page.js",
"content": "import React from 'react'\n\nconst Footer = () => {\n return (\n \n )\n}\n\nexport default Footer\n"
},
{
"path": "Video 123/comps/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 123/comps/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\nimport Navbar from \"@/components/Navbar\";\nimport Footer from \"./footer/page\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Facebook - Connect with the world\",\n description: \"Facebook helps you connect with the world\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n\n \n \n\n {children}\n
\n \n \n \n );\n}\n"
},
{
"path": "Video 123/comps/app/page.js",
"content": "'use client'\n \n\nexport default function Home() {\n \n\n return (\n <>\n
\n\n \n \n );\n}\n"
},
{
"path": "Video 123/comps/components/Navbar.js",
"content": "import React from 'react'\n\nconst Navbar = () => {\n return (\n \n Facebook
\n \n \n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 123/comps/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 123/comps/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 123/comps/package.json",
"content": "{\n \"name\": \"comps\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 123/comps/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 123/comps/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 123/website/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 123/website/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 123/website/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 123/website/app/about/page.js",
"content": "import React from 'react'\n\nconst about = () => {\n return (\n \n About\n
\n )\n}\n\nexport default about\n\nexport const metadata = {\n title: \"About Facebook - Connect with the world\",\n description: \"This is about facebook and we can connect with the world using facebook\",\n };"
},
{
"path": "Video 123/website/app/contact/page.js",
"content": "import React from 'react'\nimport Script from 'next/script'\n\nconst contact = () => {\n return (\n \n \n this is contact\n
\n )\n}\n\nexport default contact\n\nexport const metadata = {\n title: \"Contact Facebook - Connect with the world\",\n description: \"This is a page where you can contact facebook and we can connect with the world using facebook\",\n };"
},
{
"path": "Video 123/website/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 123/website/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\nimport Navbar from \"@/components/Navbar\";\nimport Footer from \"@/components/Footer\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Facebook - Connect with the world\",\n description: \"This is facebook and we can connect with the world using facebook\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n \n \n {children}\n
\n \n \n \n );\n}\n"
},
{
"path": "Video 123/website/app/page.js",
"content": "import Image from \"next/image\";\n\nexport default function Home() {\n return (\n \n
\n );\n}\n"
},
{
"path": "Video 123/website/components/Footer.js",
"content": "import React from 'react'\n\nconst Footer = () => {\n return (\n \n )\n}\n\nexport default Footer"
},
{
"path": "Video 123/website/components/Navbar.js",
"content": "import React from 'react'\nimport Link from 'next/link' \n\nconst Navbar = () => {\n return (\n \n Facebook
\n \n Home \n About \n Contact \n \n \n )\n}\n\nexport default Navbar"
},
{
"path": "Video 123/website/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 123/website/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {\n images: {\n remotePatterns: [\n {\n protocol: 'http',\n hostname: 'www.menucool.com',\n port: '', \n },\n ],\n },\n};\n\nexport default nextConfig;\n"
},
{
"path": "Video 123/website/package.json",
"content": "{\n \"name\": \"website\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 123/website/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 123/website/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 124/api-routes/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 124/api-routes/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 124/api-routes/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 124/api-routes/app/api/add/route.js",
"content": "import { NextResponse } from \"next/server\";\n\nexport async function POST(request) {\n let data = await request.json()\n console.log(data)\n return NextResponse.json({success: true, data})\n} \n "
},
{
"path": "Video 124/api-routes/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 124/api-routes/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n {children}\n \n );\n}\n"
},
{
"path": "Video 124/api-routes/app/page.js",
"content": "\"use client\"\nimport Image from \"next/image\";\n\nexport default function Home() {\n const handleClick = async () => {\n let data = {\n name: \"Shubham\",\n role: \"Coder\"\n }\n let a = await fetch(\"/api/add\", {\n method: \"POST\", headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(data),\n })\n let res = await a.json()\n console.log(res)\n }\n\n return (\n \n
Next.js Api routes demo \n click me \n \n );\n}\n"
},
{
"path": "Video 124/api-routes/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 124/api-routes/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 124/api-routes/package.json",
"content": "{\n \"name\": \"api-routes\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 124/api-routes/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 124/api-routes/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 125/server-actions/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 125/server-actions/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 125/server-actions/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 125/server-actions/actions/form.js",
"content": "\"use server\"\nimport fs from \"fs/promises\"\nexport const submitAction = async (e) => {\n console.log(e.get(\"name\"), e.get(\"add\"))\n let a = await fs.writeFile(\"harry.txt\", `Name is ${e.get(\"name\")} and Address is ${e.get(\"add\")}`) \n\n }"
},
{
"path": "Video 125/server-actions/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 125/server-actions/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n {children}\n \n );\n}\n"
},
{
"path": "Video 125/server-actions/app/page.js",
"content": "\"use client\"\nimport { submitAction } from \"@/actions/form\";\nimport { useRef } from \"react\";\n\nexport default function Home() {\n let ref = useRef()\n return (\n \n );\n}\n"
},
{
"path": "Video 125/server-actions/harry.txt",
"content": "Name is Harry and Address is India"
},
{
"path": "Video 125/server-actions/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 125/server-actions/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 125/server-actions/package.json",
"content": "{\n \"name\": \"server-actions\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 125/server-actions/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 125/server-actions/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 126/middleware/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 126/middleware/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 126/middleware/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 126/middleware/app/about/page.js",
"content": "import React from 'react'\n\nconst page = () => {\n return (\n \n About page\n
\n )\n}\n\nexport default page\n"
},
{
"path": "Video 126/middleware/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 126/middleware/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n {children}\n \n );\n}\n"
},
{
"path": "Video 126/middleware/app/page.js",
"content": "import Image from \"next/image\";\n\nexport default function Home() {\n return (\n \n \n
\n Get started by editing \n app/page.js\n
\n
\n
\n
\n\n \n
\n \n Docs{\" \"}\n \n ->\n \n \n \n Find in-depth information about Next.js features and API.\n
\n \n\n \n \n Learn{\" \"}\n \n ->\n \n \n \n Learn about Next.js in an interactive course with quizzes!\n
\n \n\n \n \n Templates{\" \"}\n \n ->\n \n \n \n Explore starter templates for Next.js.\n
\n \n\n \n \n Deploy{\" \"}\n \n ->\n \n \n \n Instantly deploy your Next.js site to a shareable URL with Vercel.\n
\n \n \n );\n}\n"
},
{
"path": "Video 126/middleware/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 126/middleware/middleware.js",
"content": "// import { NextResponse } from 'next/server'\n \n// // This function can be marked `async` if using `await` inside\n// export function middleware(request) {\n// // return NextResponse.json({ message: 'Hello from the about page' })\n// return NextResponse.redirect(new URL('/', request.url))\n// }\n \n// // See \"Matching Paths\" below to learn more\n// export const config = {\n// matcher: '/about/:path*',\n// }\n\n\nimport { NextResponse } from 'next/server'\n \nexport function middleware(request) {\n if (request.nextUrl.pathname.startsWith('/about')) {\n return NextResponse.rewrite(new URL('/', request.url))\n }\n \n if (request.nextUrl.pathname.startsWith('/dashboard')) {\n return NextResponse.redirect(new URL('/', request.url))\n }\n}"
},
{
"path": "Video 126/middleware/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 126/middleware/package.json",
"content": "{\n \"name\": \"middleware\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.1\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.1\"\n }\n}\n"
},
{
"path": "Video 126/middleware/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 126/middleware/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 127/nextauth-demo/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 127/nextauth-demo/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 127/nextauth-demo/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 127/nextauth-demo/app/api/auth/[...nextauth]/route.js",
"content": "import NextAuth from 'next-auth'\nimport GithubProvider from \"next-auth/providers/github\"\n\nconst handler = NextAuth({\n providers: [\n // OAuth authentication providers...\n GithubProvider({\n clientId: process.env.GITHUB_ID,\n clientSecret: process.env.GITHUB_SECRET,\n }),\n ]\n})\n\nexport {handler as GET, handler as POST}"
},
{
"path": "Video 127/nextauth-demo/app/component/SessionWrapper.js",
"content": "\"use client\"\nimport { SessionProvider } from \"next-auth/react\"\n\n\nconst SessionWrapper = ({children}) => {\n return (\n {children} \n )\n}\n\nexport default SessionWrapper\n"
},
{
"path": "Video 127/nextauth-demo/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 127/nextauth-demo/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\nimport SessionWrapper from \"./component/SessionWrapper\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n \n {children}\n \n \n );\n}\n"
},
{
"path": "Video 127/nextauth-demo/app/page.js",
"content": "\"use client\"\nimport { useSession, signIn, signOut } from \"next-auth/react\"\n\nexport default function Component() {\n const { data: session } = useSession()\n console.log(session)\n if(session) {\n return <>\n Signed in as {session.user.email} signOut()}>Sign out \n \n }\n return <>\n Not signed in signIn(\"github\")}>Sign in using Github \n signIn(\"google\")}>Sign in using Google \n \n}"
},
{
"path": "Video 127/nextauth-demo/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 127/nextauth-demo/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 127/nextauth-demo/package.json",
"content": "{\n \"name\": \"nextauth-demo\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"next\": \"14.1.0\",\n \"next-auth\": \"^4.24.6\",\n \"react\": \"^18\",\n \"react-dom\": \"^18\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\"\n }\n}\n"
},
{
"path": "Video 127/nextauth-demo/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 127/nextauth-demo/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 128/dynamic-routes/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 128/dynamic-routes/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 128/dynamic-routes/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 128/dynamic-routes/app/about/[...val]/page.js",
"content": "export default function Page({ params }) {\n console.log(params)\n // fetch your blog post by its slug\n return I am about page check console
\n }"
},
{
"path": "Video 128/dynamic-routes/app/blog/page.js",
"content": "import React from 'react'\n\nconst page = () => {\n return (\n \n All Blogs\n
\n )\n}\n\nexport default page\n"
},
{
"path": "Video 128/dynamic-routes/app/blogpost/[slug]/page.js",
"content": "export default function Page({ params }) {\n // throw new Error(\"error hai\")\n // fetch your blog post by its slug\n let languages = [\"python\", \"javascript\", \"java\", \"cpp\", \"cs\"]\n if(languages.includes(params.slug)){\n return My Post: {params.slug}
\n }\n else{\n return Post not found
\n }\n return My Post: {params.slug}
\n }"
},
{
"path": "Video 128/dynamic-routes/app/error.js",
"content": "'use client' // Error components must be Client Components\n \nimport { useEffect } from 'react'\n \nexport default function Error({ error, reset }) {\n useEffect(() => {\n // Log the error to an error reporting service\n console.error(error)\n }, [error])\n \n return (\n \n
Something went wrong! \n reset()\n }\n >\n Try again\n \n \n )\n}"
},
{
"path": "Video 128/dynamic-routes/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 128/dynamic-routes/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n {children}\n \n );\n}\n"
},
{
"path": "Video 128/dynamic-routes/app/not-found.js",
"content": "import Link from 'next/link'\n \nexport default function NotFound() {\n return (\n \n
Not Found \n
Could not find requested resource
\n
Return Home\n
\n \n
\n Get started by editing \n app/page.js\n
\n
\n
\n
\n\n \n
\n \n Docs{\" \"}\n \n ->\n \n \n \n Find in-depth information about Next.js features and API.\n
\n \n\n \n \n Learn{\" \"}\n \n ->\n \n \n \n Learn about Next.js in an interactive course with quizzes!\n
\n \n\n \n \n Templates{\" \"}\n \n ->\n \n \n \n Explore starter templates for Next.js.\n
\n \n\n \n \n Deploy{\" \"}\n \n ->\n \n \n \n Instantly deploy your Next.js site to a shareable URL with Vercel.\n
\n \n \n );\n}\n"
},
{
"path": "Video 128/dynamic-routes/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 128/dynamic-routes/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 128/dynamic-routes/package.json",
"content": "{\n \"name\": \"dynamic-routes\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 128/dynamic-routes/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 128/dynamic-routes/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 129/layouts/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 129/layouts/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 129/layouts/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 129/layouts/app/(admin)/admincomments/page.js",
"content": "import React from 'react'\n\nconst Comment = () => {\n return (\n \n Comments\n
\n )\n}\n\nexport default Comment\n"
},
{
"path": "Video 129/layouts/app/(admin)/adminlogin/page.js",
"content": "import React from 'react'\n\nconst page = () => {\n return (\n \n Admin Login \n
Feel free to login as an Admin
\n
Logout Navbar \n {children} \n \n );\n}\n"
},
{
"path": "Video 129/layouts/app/(admin)/adminlogout/page.js",
"content": "import React from 'react'\n\nconst page = () => {\n return (\n \n Logout\n
\n )\n}\n\nexport default page\n"
},
{
"path": "Video 129/layouts/app/(admin)/layout.js",
"content": "import { Inter } from \"next/font/google\"; \nimport Navbar from \"@/components/Navbar\";\nimport Footer from \"@/components/Footer\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Admin: Facebook - Connect with friends and the world around you\",\n description: \"Admin Page: Facebook is a social utility that connects people with friends and others who work, study and live around them. People use Facebook to keep up with friends, upload an unlimited number of photos, post links and videos, and learn more about the people they meet.\",\n};\n\nexport default function AdminLayout({ children }) {\n return (\n <>\n Admin Navbar \n {children} \n \n );\n}\n"
},
{
"path": "Video 129/layouts/app/about/page.js",
"content": "import React from 'react'\n\nconst page = () => {\n return (\n \n Facebook is a social utility that connects people with friends and others who work, study and live around them. People use Facebook to keep up with friends, upload an unlimited number of photos, post links and videos, and learn more about the people they meet.\n
\n )\n}\n\nexport default page\n"
},
{
"path": "Video 129/layouts/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --foreground-rgb: 0, 0, 0;\n --background-start-rgb: 214, 219, 220;\n --background-end-rgb: 255, 255, 255;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --foreground-rgb: 255, 255, 255;\n --background-start-rgb: 0, 0, 0;\n --background-end-rgb: 0, 0, 0;\n }\n}\n\nbody {\n color: rgb(var(--foreground-rgb));\n background: linear-gradient(\n to bottom,\n transparent,\n rgb(var(--background-end-rgb))\n )\n rgb(var(--background-start-rgb));\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 129/layouts/app/layout.js",
"content": "import { Inter } from \"next/font/google\";\nimport \"./globals.css\";\nimport Navbar from \"@/components/Navbar\";\nimport Footer from \"@/components/Footer\";\n\nconst inter = Inter({ subsets: [\"latin\"] });\n\nexport const metadata = {\n title: \"Facebook - Connect with friends and the world around you\",\n description: \"Facebook is a social utility that connects people with friends and others who work, study and live around them. People use Facebook to keep up with friends, upload an unlimited number of photos, post links and videos, and learn more about the people they meet.\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n \n \n I am homepage\n
\n );\n}\n"
},
{
"path": "Video 129/layouts/components/Footer.js",
"content": "import React from 'react'\n\nconst Footer = () => {\n return (\n \n )\n}\n\nexport default Footer\n"
},
{
"path": "Video 129/layouts/components/Navbar.js",
"content": "import Link from 'next/link'\n\nconst Navbar = () => {\n return (\n \n \n
\n \n )\n}\n\nexport default Navbar"
},
{
"path": "Video 129/layouts/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 129/layouts/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 129/layouts/package.json",
"content": "{\n \"name\": \"layouts\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"next\": \"14.1.0\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.0\"\n }\n}\n"
},
{
"path": "Video 129/layouts/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 129/layouts/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 13/index.html",
"content": "\n\n\n Document \n\n\n 3>4\n this is the code for paragraph <p></p>\n \n This is a para
\n\n\n\n this is after few new lines and some more\n \n\n Copyright © codewithharry\n\n \n Quotation text here.\n \nThis is html boilerplate code \n \n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Document</title>\n</head>\n<body>\n \n</body>\n</html>\n PassOP - Your own password manager \n \n \n
\n \n \n \n\n"
},
{
"path": "Video 130/passop/package.json",
"content": "{\n \"name\": \"passop\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vite build\",\n \"lint\": \"eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0\",\n \"preview\": \"vite preview\"\n },\n \"dependencies\": {\n \"react\": \"^18.2.0\",\n \"react-dom\": \"^18.2.0\",\n \"react-toastify\": \"^9.1.3\",\n \"uuid\": \"^9.0.1\"\n },\n \"devDependencies\": {\n \"@types/react\": \"^18.2.56\",\n \"@types/react-dom\": \"^18.2.19\",\n \"@vitejs/plugin-react\": \"^4.2.1\",\n \"autoprefixer\": \"^10.4.18\",\n \"eslint\": \"^8.56.0\",\n \"eslint-plugin-react\": \"^7.33.2\",\n \"eslint-plugin-react-hooks\": \"^4.6.0\",\n \"eslint-plugin-react-refresh\": \"^0.4.5\",\n \"postcss\": \"^8.4.35\",\n \"tailwindcss\": \"^3.4.1\",\n \"vite\": \"^5.1.4\"\n }\n}\n"
},
{
"path": "Video 130/passop/postcss.config.js",
"content": "export default {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n}\n"
},
{
"path": "Video 130/passop/src/App.css",
"content": ""
},
{
"path": "Video 130/passop/src/App.jsx",
"content": "import { useState } from 'react' \nimport './App.css'\nimport Navbar from './components/Navbar'\nimport Manager from './components/Manager'\nimport Footer from './components/Footer'\n\nfunction App() { \n\n return (\n <>\n \n\n
\n \n \n )\n}\n\nexport default App\n"
},
{
"path": "Video 130/passop/src/components/Footer.jsx",
"content": "import React from 'react'\n\nconst Footer = () => {\n return (\n \n
\n < \n\n Pass OP/> \n\n\n
\n
Created with
by CodeWithHarry
\n
\n
\n < \n\n Pass OP/> \n\n \n
Your own Password Manager
\n\n
\n
\n
\n
\n
\n\n
\n
\n \n
\n\n
\n
\n \n \n Save \n
\n\n
\n
Your Passwords \n {passwordArray.length === 0 &&
No passwords to show
}\n {passwordArray.length != 0 &&
\n \n \n Site \n Username \n Password \n Actions \n \n \n \n {passwordArray.map((item, index) => {\n return \n \n \n \n \n \n
{item.username} \n
{ copyText(item.username) }}>\n \n \n
\n
\n \n \n
{item.password} \n
{ copyText(item.password) }}>\n \n \n
\n
\n \n {editPassword(item.id)}}>\n \n \n \n {deletePassword(item.id)}}>\n \n \n \n \n \n\n })}\n \n
}\n
\n
\n \n\n
\n < \n \n Pass OP/> \n \n \n
\n {/*
*/}\n
\n GitHub \n \n \n
\n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 130/passop/src/index.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n \n\n@layer components {\n .mycontainer {\n @apply container px-40 py-16 mx-auto ;\n }\n}"
},
{
"path": "Video 130/passop/src/main.jsx",
"content": "import React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App.jsx'\nimport './index.css'\n\nReactDOM.createRoot(document.getElementById('root')).render(\n \n ,\n)\n"
},
{
"path": "Video 130/passop/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nexport default {\n content: [\n \"./index.html\",\n \"./src/**/*.{js,ts,jsx,tsx}\",\n ],\n theme: {\n extend: {},\n },\n plugins: [],\n}"
},
{
"path": "Video 130/passop/vite.config.js",
"content": "import { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\n\n// https://vitejs.dev/config/\nexport default defineConfig({\n plugins: [react()],\n})\n"
},
{
"path": "Video 130/passop-mongo/.eslintrc.cjs",
"content": "module.exports = {\n root: true,\n env: { browser: true, es2020: true },\n extends: [\n 'eslint:recommended',\n 'plugin:react/recommended',\n 'plugin:react/jsx-runtime',\n 'plugin:react-hooks/recommended',\n ],\n ignorePatterns: ['dist', '.eslintrc.cjs'],\n parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },\n settings: { react: { version: '18.2' } },\n plugins: ['react-refresh'],\n rules: {\n 'react/jsx-no-target-blank': 'off',\n 'react-refresh/only-export-components': [\n 'warn',\n { allowConstantExport: true },\n ],\n },\n}\n"
},
{
"path": "Video 130/passop-mongo/.gitignore",
"content": "# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\npnpm-debug.log*\nlerna-debug.log*\n\nnode_modules\ndist\ndist-ssr\n*.local\n\n# Editor directories and files\n.vscode/*\n!.vscode/extensions.json\n.idea\n.DS_Store\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n*.sw?\n"
},
{
"path": "Video 130/passop-mongo/README.md",
"content": "# React + Vite\n\nThis template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.\n\nCurrently, two official plugins are available:\n\n- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh\n- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh\n"
},
{
"path": "Video 130/passop-mongo/backend/package.json",
"content": "{\n \"name\": \"backend\",\n \"version\": \"1.0.0\",\n \"description\": \"\",\n \"main\": \"index.js\",\n \"scripts\": {\n \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n },\n \"keywords\": [],\n \"author\": \"\",\n \"license\": \"ISC\",\n \"dependencies\": {\n \"body-parser\": \"^1.20.2\",\n \"cors\": \"^2.8.5\",\n \"dotenv\": \"^16.4.5\",\n \"express\": \"^4.18.3\",\n \"mongodb\": \"^6.4.0\"\n }\n}\n"
},
{
"path": "Video 130/passop-mongo/backend/server.js",
"content": "const express = require('express')\nconst dotenv = require('dotenv')\nconst { MongoClient } = require('mongodb'); \nconst bodyparser = require('body-parser')\nconst cors = require('cors')\n\ndotenv.config()\n\n\n// Connecting to the MongoDB Client\nconst url = process.env.MONGO_URI;\nconst client = new MongoClient(url);\nclient.connect();\n\n// App & Database\nconst dbName = process.env.DB_NAME \nconst app = express()\nconst port = 3000 \n\n// Middleware\napp.use(bodyparser.json())\napp.use(cors())\n\n\n// Get all the passwords\napp.get('/', async (req, res) => {\n const db = client.db(dbName);\n const collection = db.collection('passwords');\n const findResult = await collection.find({}).toArray();\n res.json(findResult)\n})\n\n// Save a password\napp.post('/', async (req, res) => { \n const password = req.body\n const db = client.db(dbName);\n const collection = db.collection('passwords');\n const findResult = await collection.insertOne(password);\n res.send({success: true, result: findResult})\n})\n\n// Delete a password by id\napp.delete('/', async (req, res) => { \n const password = req.body\n const db = client.db(dbName);\n const collection = db.collection('passwords');\n const findResult = await collection.deleteOne(password);\n res.send({success: true, result: findResult})\n})\n\n\napp.listen(port, () => {\n console.log(`Example app listening on http://localhost:${port}`)\n})"
},
{
"path": "Video 130/passop-mongo/index.html",
"content": "\n\n \n PassOP - Your own password manager \n \n \n
\n \n \n \n\n"
},
{
"path": "Video 130/passop-mongo/package.json",
"content": "{\n \"name\": \"passop\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vite build\",\n \"lint\": \"eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0\",\n \"preview\": \"vite preview\"\n },\n \"dependencies\": {\n \"dotenv\": \"^16.4.5\",\n \"react\": \"^18.2.0\",\n \"react-dom\": \"^18.2.0\",\n \"react-toastify\": \"^9.1.3\",\n \"uuid\": \"^9.0.1\"\n },\n \"devDependencies\": {\n \"@types/react\": \"^18.2.56\",\n \"@types/react-dom\": \"^18.2.19\",\n \"@vitejs/plugin-react\": \"^4.2.1\",\n \"autoprefixer\": \"^10.4.18\",\n \"eslint\": \"^8.56.0\",\n \"eslint-plugin-react\": \"^7.33.2\",\n \"eslint-plugin-react-hooks\": \"^4.6.0\",\n \"eslint-plugin-react-refresh\": \"^0.4.5\",\n \"postcss\": \"^8.4.35\",\n \"tailwindcss\": \"^3.4.1\",\n \"vite\": \"^5.1.4\"\n }\n}\n"
},
{
"path": "Video 130/passop-mongo/postcss.config.js",
"content": "export default {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n}\n"
},
{
"path": "Video 130/passop-mongo/src/App.css",
"content": ""
},
{
"path": "Video 130/passop-mongo/src/App.jsx",
"content": "import { useState } from 'react'\nimport './App.css'\nimport Navbar from './components/Navbar'\nimport Manager from './components/Manager'\nimport Footer from './components/Footer'\n\nfunction App() {\n\n return (\n <>\n \n
\n \n \n )\n}\n\nexport default App\n"
},
{
"path": "Video 130/passop-mongo/src/components/Footer.jsx",
"content": "import React from 'react'\n\nconst Footer = () => {\n return (\n \n
\n < \n Pass OP/> \n
\n
Created with
by CodeWithHarry
\n
\n
\n < \n\n Pass OP/> \n\n \n
Your own Password Manager
\n\n
\n
\n
\n
\n
\n
\n
\n \n
\n\n
\n
\n \n \n Save \n
\n\n
\n
Your Passwords \n {passwordArray.length === 0 &&
No passwords to show
}\n {passwordArray.length != 0 &&
\n \n \n Site \n Username \n Password \n Actions \n \n \n \n {passwordArray.map((item, index) => {\n return \n \n \n \n \n \n
{item.username} \n
{ copyText(item.username) }}>\n \n \n
\n
\n \n \n
{\"*\".repeat(item.password.length)} \n
{ copyText(item.password) }}>\n \n \n
\n
\n \n { editPassword(item.id) }}>\n \n \n \n { deletePassword(item.id) }}>\n \n \n \n \n \n })}\n \n
}\n
\n
\n \n\n
\n < \n Pass OP/> \n
\n {/*
*/}\n
\n GitHub \n\n \n
\n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 130/passop-mongo/src/index.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n \n\n@layer components {\n .mycontainer {\n @apply container px-40 py-16 mx-auto ;\n }\n}"
},
{
"path": "Video 130/passop-mongo/src/main.jsx",
"content": "import React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App.jsx'\nimport './index.css'\n\nReactDOM.createRoot(document.getElementById('root')).render(\n \n ,\n)\n"
},
{
"path": "Video 130/passop-mongo/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nexport default {\n content: [\n \"./index.html\",\n \"./src/**/*.{js,ts,jsx,tsx}\",\n ],\n theme: {\n extend: {},\n },\n plugins: [],\n}"
},
{
"path": "Video 130/passop-mongo/vite.config.js",
"content": "import { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\n\n// https://vitejs.dev/config/\nexport default defineConfig({\n plugins: [react()],\n})\n"
},
{
"path": "Video 131/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 131/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 131/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 131/actions/useractions.js",
"content": "\"use server\"\n\nimport Razorpay from \"razorpay\"\nimport Payment from \"@/models/Payment\"\nimport connectDb from \"@/db/connectDb\"\nimport User from \"@/models/User\"\n\n\nexport const initiate = async (amount, to_username, paymentform) => {\n await connectDb()\n // fetch the secret of the user who is getting the payment \n let user = await User.findOne({username: to_username})\n const secret = user.razorpaysecret\n\n var instance = new Razorpay({ key_id: user.razorpayid, key_secret: secret })\n\n\n\n let options = {\n amount: Number.parseInt(amount),\n currency: \"INR\",\n }\n\n let x = await instance.orders.create(options)\n\n // create a payment object which shows a pending payment in the database\n await Payment.create({ oid: x.id, amount: amount/100, to_user: to_username, name: paymentform.name, message: paymentform.message })\n\n return x\n\n}\n\n\nexport const fetchuser = async (username) => {\n await connectDb()\n let u = await User.findOne({ username: username })\n let user = u.toObject({ flattenObjectIds: true })\n return user\n}\n\nexport const fetchpayments = async (username) => {\n await connectDb()\n // find all payments sorted by decreasing order of amount and flatten object ids\n let p = await Payment.find({ to_user: username, done:true }).sort({ amount: -1 }).limit(10).lean()\n return p\n}\n\nexport const updateProfile = async (data, oldusername) => {\n await connectDb()\n let ndata = Object.fromEntries(data)\n\n // If the username is being updated, check if username is available\n if (oldusername !== ndata.username) {\n let u = await User.findOne({ username: ndata.username })\n if (u) {\n return { error: \"Username already exists\" }\n } \n await User.updateOne({email: ndata.email}, ndata)\n // Now update all the usernames in the Payments table \n await Payment.updateMany({to_user: oldusername}, {to_user: ndata.username})\n \n }\n else{\n\n \n await User.updateOne({email: ndata.email}, ndata)\n }\n\n\n}\n\n\n"
},
{
"path": "Video 131/app/[username]/page.js",
"content": "import React from 'react'\nimport PaymentPage from '@/components/PaymentPage'\nimport { notFound } from \"next/navigation\"\nimport connectDb from '@/db/connectDb'\nimport User from '@/models/User'\nconst Username = async ({ params }) => {\n\n // If the username is not present in the database, show a 404 page\n const checkUser = async () => {\n await connectDb()\n let u = await User.findOne({ username: params.username })\n if (!u) {\n return notFound()\n }\n }\n await checkUser()\n\n\n\n return (\n <>\n \n
About Get Me a Chai \n
\n Get Me a Chai is a crowdfunding platform designed for creators to fund their projects with the support of their fans. It's a space where your fans can directly contribute to your creative endeavors by buying you a chai. Unlock the potential of your fanbase and bring your projects to life.\n
\n\n
How It Works \n
\n
\n
\n
\n
Fans Want to Collaborate \n
Your fans are enthusiastic about collaborating with you on your projects.
\n
\n
\n
\n
\n
\n
Support Through Chai \n
Receive support from your fans in the form of chai purchases, directly contributing to your project funding.
\n
\n
\n {/* Add more steps as needed */}\n
\n\n
Benefits for Creators \n
\n Direct financial support from your fanbase \n Engage with your fans on a more personal level \n Access to a platform tailored for creative projects \n {/* Add more benefits */}\n \n\n
Benefits for Fans \n
\n Directly contribute to the success of your favorite creators \n Exclusive rewards and perks for supporting creators \n Be part of the creative process and connect with creators \n {/* Add more benefits */}\n \n\n {/* Additional sections */}\n
Benefits of Collaboration \n
\n Unlock new opportunities through collaboration with fellow creators \n Expand your network and reach a wider audience \n Combine skills and resources to create innovative projects \n {/* Add more benefits */}\n \n\n
Community Engagement \n
\n Interact with a supportive community of like-minded individuals \n Receive valuable feedback and encouragement from peers \n Participate in discussions and events centered around your interests \n {/* Add more benefits */}\n \n\n
Access to Resources \n
\n Gain access to resources such as tutorials, templates, and tools \n Receive guidance and mentorship from experienced creators \n Stay updated on industry trends and best practices \n {/* Add more benefits */}\n \n\n
Recognition and Exposure \n
\n Showcase your work to a global audience and gain recognition \n Feature in promotional materials and campaigns \n Build your portfolio and increase your credibility as a creator \n {/* Add more benefits */}\n \n\n
Supportive Community \n
\n Join a community that values creativity, diversity, and inclusivity \n Find encouragement and inspiration from fellow members \n Collaborate on projects and share resources for mutual growth \n {/* Add more benefits */}\n \n\n
'\n // }),\n ],\n callbacks: {\n async signIn({ user, account, profile, email, credentials }) {\n if(account.provider == \"github\") { \n await connectDb()\n // Check if the user already exists in the database\n const currentUser = await User.findOne({email: email}) \n if(!currentUser){\n // Create a new user\n const newUser = await User.create({\n email: user.email, \n username: user.email.split(\"@\")[0], \n }) \n } \n return true\n }\n },\n \n async session({ session, user, token }) {\n const dbUser = await User.findOne({email: session.user.email})\n session.user.name = dbUser.username\n return session\n },\n } \n })\n\n export { authoptions as GET, authoptions as POST}"
},
{
"path": "Video 131/app/api/razorpay/route.js",
"content": "import { NextResponse } from \"next/server\";\nimport { validatePaymentVerification } from \"razorpay/dist/utils/razorpay-utils\";\nimport Payment from \"@/models/Payment\";\nimport Razorpay from \"razorpay\";\nimport connectDb from \"@/db/connectDb\";\nimport User from \"@/models/User\";\n\nexport const POST = async (req) => {\n await connectDb()\n let body = await req.formData()\n body = Object.fromEntries(body)\n\n // Check if razorpayOrderId is present on the server\n let p = await Payment.findOne({oid: body.razorpay_order_id})\n if(!p){\n return NextResponse.json({success: false, message:\"Order Id not found\"})\n }\n\n // fetch the secret of the user who is getting the payment \n let user = await User.findOne({username: p.to_user})\n const secret = user.razorpaysecret\n\n // Verify the payment\n let xx = validatePaymentVerification({\"order_id\": body.razorpay_order_id, \"payment_id\": body.razorpay_payment_id}, body.razorpay_signature, secret)\n\n if(xx){\n // Update the payment status\n const updatedPayment = await Payment.findOneAndUpdate({oid: body.razorpay_order_id}, {done: \"true\"}, {new: true})\n return NextResponse.redirect(`${process.env.NEXT_PUBLIC_URL}/${updatedPayment.to_user}?paymentdone=true`) \n }\n\n else{\n return NextResponse.json({success: false, message:\"Payment Verification Failed\"})\n }\n\n}"
},
{
"path": "Video 131/app/dashboard/page.js",
"content": "\nimport Dashboard from '@/components/Dashboard'\n\nconst DashboardPage = () => {\n return (\n \n \n {children}\n
\n \n \n \n \n );\n}\n"
},
{
"path": "Video 131/app/login/page.js",
"content": "\"use client\"\nimport React, {useEffect} from 'react'\nimport { useSession, signIn, signOut } from \"next-auth/react\"\nimport { useRouter } from 'next/navigation'\n\nconst Login = () => {\n const { data: session } = useSession()\n const router = useRouter()\n\n useEffect(() => {\n document.title = \"Login - Get Me A Chai\" \n console.log(session)\n if (session) {\n router.push('/dashboard')\n }\n }, [])\n\n return (\n \n
Login to Get Started \n\n
\n\n\n
\n \n\n \n \n \n \n \n \n \n \n \n \n \n Continue with Google \n \n\n\n \n \n \n \n \n\n \n \n \n Continue with LinkedIn \n \n\n\n \n \n \n \n \n \n \n\n Continue with Twitter \n \n\n\n \n \n \n \n \n\n \n \n \n \n\n Continue with Facebook \n \n\n\n { signIn(\"github\") }}\n className=\"flex items-center w-64 bg-slate-50 text-black border border-gray-300 rounded-lg shadow-md max-w-xs px-6 py-2 text-sm font-medium hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500\">\n \n \n \n \n\n \n \n\n \n \n \n \n\n Continue with Github \n \n\n\n \n \n \n \n \n \n\n \n \n \n \n \n\n Continue with Apple \n \n\n\n \n
\n
Get Me a Chai
\n
\n A crowdfunding platform for creators to fund their projects. \n \n
\n
\n\n A place where your fans can buy you a chai. Unleash the power of your fans and get your projects funded.\n
\n
\n Start Here \n \n\n Read More \n \n\n
\n
\n
\n\n \n
Your Fans can buy you a Chai \n
\n
\n
\n
Fans want to help
\n
Your fans are available to support you
\n
\n
\n
\n
Fans want to contribute
\n
Your fans are willing to contribute financially
\n
\n
\n
\n
Fans want to collaborate
\n
Your fans are ready to collaborate with you
\n
\n
\n
\n
\n\n \n
Learn more about us \n {/* Responsive youtube embed */}\n
\n VIDEO \n\n
\n \n
\n
Welcome to your Dashboard \n\n
\n\n\n
\n\n Get Me a Chai! \n \n\n {/* \n Home \n About \n Projects \n Sign Up \n Login \n */}\n\n \n {session && <>\n
setShowdropdown(!showdropdown)} onBlur={() => {\n setTimeout(() => {\n setShowdropdown(false)\n }, 100);\n }} id=\"dropdownDefaultButton\" data-dropdown-toggle=\"dropdown\" className=\"text-white mx-2 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-2 py-2.5 text-center inline-flex items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800\" type=\"button\">Account\n \n \n\n
\n
\n \n \n \n \n \n \n \n
\n }\n\n {session &&
{ signOut() }}>Logout }\n {!session &&
\n
Login }\n
\n )\n}\n\nexport default Navbar\n"
},
{
"path": "Video 131/components/PaymentPage.js",
"content": "\"use client\"\nimport React, { useEffect, useState } from 'react'\nimport Script from 'next/script'\nimport { useSession } from 'next-auth/react'\nimport { fetchuser, fetchpayments, initiate } from '@/actions/useractions'\nimport { useSearchParams } from 'next/navigation'\nimport { ToastContainer, toast } from 'react-toastify';\nimport 'react-toastify/dist/ReactToastify.css';\nimport { Bounce } from 'react-toastify';\nimport { useRouter } from 'next/navigation'\nimport { notFound } from \"next/navigation\"\n\nconst PaymentPage = ({ username }) => {\n // const { data: session } = useSession()\n\n const [paymentform, setPaymentform] = useState({name: \"\", message: \"\", amount: \"\"})\n const [currentUser, setcurrentUser] = useState({})\n const [payments, setPayments] = useState([])\n const searchParams = useSearchParams()\n const router = useRouter()\n\n useEffect(() => {\n getData()\n }, [])\n\n useEffect(() => {\n if(searchParams.get(\"paymentdone\") == \"true\"){\n toast('Thanks for your donation!', {\n position: \"top-right\",\n autoClose: 5000,\n hideProgressBar: false,\n closeOnClick: true,\n pauseOnHover: true,\n draggable: true,\n progress: undefined,\n theme: \"light\",\n transition: Bounce,\n });\n }\n router.push(`/${username}`)\n \n }, [])\n \n\n const handleChange = (e) => {\n setPaymentform({ ...paymentform, [e.target.name]: e.target.value })\n }\n\n const getData = async () => {\n let u = await fetchuser(username)\n setcurrentUser(u)\n let dbpayments = await fetchpayments(username)\n setPayments(dbpayments) \n }\n\n\n const pay = async (amount) => {\n // Get the order Id \n let a = await initiate(amount, username, paymentform)\n let orderId = a.id\n var options = {\n \"key\": currentUser.razorpayid, // Enter the Key ID generated from the Dashboard\n \"amount\": amount, // Amount is in currency subunits. Default currency is INR. Hence, 50000 refers to 50000 paise\n \"currency\": \"INR\",\n \"name\": \"Get Me A Chai\", //your business name\n \"description\": \"Test Transaction\",\n \"image\": \"https://example.com/your_logo\",\n \"order_id\": orderId, //This is a sample Order ID. Pass the `id` obtained in the response of Step 1\n \"callback_url\": `${process.env.NEXT_PUBLIC_URL}/api/razorpay`,\n \"prefill\": { //We recommend using the prefill parameter to auto-fill customer's contact information especially their phone number\n \"name\": \"Gaurav Kumar\", //your customer's name\n \"email\": \"gaurav.kumar@example.com\",\n \"contact\": \"9000090000\" //Provide the customer's phone number for better conversion rates \n },\n \"notes\": {\n \"address\": \"Razorpay Corporate Office\"\n },\n \"theme\": {\n \"color\": \"#3399cc\"\n }\n }\n\n var rzp1 = new Razorpay(options);\n rzp1.open();\n }\n\n \n return (\n <>\n \n
\n
\n
\n
\n
\n
\n\n @{username}\n
\n
\n Lets help {username} get a chai!\n\n
\n
\n {payments.length} Payments . βΉ{payments.reduce((a, b) => a + b.amount, 0)} raised\n
\n\n
\n
\n {/* Show list of all the supporters as a leaderboard */}\n
Top 10 Supporters \n
\n {payments.length == 0 && No payments yet }\n {payments.map((p, i) => {\n return \n \n {p.name} donated βΉ{p.amount} with a message "{p.message}"\n \n \n })}\n\n \n
\n\n
\n
Make a Payment \n
\n {/* Or choose from these amounts */}\n
\n pay(1000)}>Pay βΉ10 \n pay(2000)}>Pay βΉ20 \n pay(3000)}>Pay βΉ30 \n
\n
\n
\n
\n {children}\n \n )\n}"
},
{
"path": "Video 131/db/connectDb.js",
"content": "\nimport mongoose from \"mongoose\";\n\nconst connectDb = async () => {\n try {\n const conn = await mongoose.connect(process.env.MONGO_URI, {\n useNewUrlParser: true,\n });\n console.log(`MongoDB Connected: ${conn.connection.host}`);\n return conn;\n \n } catch (error) {\n console.error(error.message);\n process.exit(1);\n }\n }\n\n export default connectDb;"
},
{
"path": "Video 131/jsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"paths\": {\n \"@/*\": [\"./*\"]\n }\n }\n}\n"
},
{
"path": "Video 131/models/Payment.js",
"content": "import mongoose from \"mongoose\";\nconst { Schema, model } = mongoose;\n\nconst PaymentSchema = new Schema({\n name: { type: String, required: true },\n to_user: { type: String, required: true },\n oid: { type: String, required: true },\n message: { type: String },\n amount: { type: Number, required: true },\n createdAt: { type: Date, default: Date.now },\n updatedAt: { type: Date, default: Date.now }, \n done: { type: Boolean, default: false },\n });\n\n \nexport default mongoose.models.Payment || model(\"Payment\", PaymentSchema);;\n\n"
},
{
"path": "Video 131/models/User.js",
"content": "import mongoose from \"mongoose\";\nconst { Schema, model } = mongoose;\n\nconst UserSchema = new Schema({\n email: { type: String, required: true },\n name: { type: String},\n username: { type: String, required: true },\n profilepic: {type: String},\n coverpic: {type: String},\n razorpayid: { type: String },\n razorpaysecret: { type: String },\n createdAt: { type: Date, default: Date.now },\n updatedAt: { type: Date, default: Date.now },\n });\n\n \nexport default mongoose.models.User || model(\"User\", UserSchema);;"
},
{
"path": "Video 131/next.config.mjs",
"content": "/** @type {import('next').NextConfig} */\nconst nextConfig = {};\n\nexport default nextConfig;\n"
},
{
"path": "Video 131/package.json",
"content": "{\n \"name\": \"get-me-a-chai\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\",\n \"lint\": \"next lint\"\n },\n \"dependencies\": {\n \"mongoose\": \"^8.2.2\",\n \"next\": \"^14.1.3\",\n \"next-auth\": \"^4.24.7\",\n \"razorpay\": \"^2.9.2\",\n \"react\": \"^18\",\n \"react-dom\": \"^18\",\n \"react-toastify\": \"^9.1.3\"\n },\n \"devDependencies\": {\n \"autoprefixer\": \"^10.0.1\",\n \"eslint\": \"^8\",\n \"eslint-config-next\": \"14.1.3\",\n \"postcss\": \"^8\",\n \"tailwindcss\": \"^3.3.0\"\n }\n}\n"
},
{
"path": "Video 131/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n};\n"
},
{
"path": "Video 131/tailwind.config.js",
"content": "/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n content: [\n \"./pages/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./components/**/*.{js,ts,jsx,tsx,mdx}\",\n \"./app/**/*.{js,ts,jsx,tsx,mdx}\",\n ],\n theme: {\n extend: {\n backgroundImage: {\n \"gradient-radial\": \"radial-gradient(var(--tw-gradient-stops))\",\n \"gradient-conic\":\n \"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))\",\n },\n },\n },\n plugins: [],\n};\n"
},
{
"path": "Video 132/next-navigation-tutorial/.eslintrc.json",
"content": "{\n \"extends\": \"next/core-web-vitals\"\n}\n"
},
{
"path": "Video 132/next-navigation-tutorial/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n.yarn/install-state.gz\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env*.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "Video 132/next-navigation-tutorial/README.md",
"content": "This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n# or\nbun dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n"
},
{
"path": "Video 132/next-navigation-tutorial/app/about/page.js",
"content": "import React from 'react'\n\nconst About = () => {\n return (\n About
\n )\n}\n\nexport default About"
},
{
"path": "Video 132/next-navigation-tutorial/app/blogpost/[slug]/page.js",
"content": "\"use client\"\nimport React, { useEffect } from 'react'\nimport { useParams } from 'next/navigation'\nimport { useRouter } from 'next/navigation'\n\nconst page = () => {\n const params = useParams()\n const router = useRouter()\n\n useEffect(() => {\n setTimeout(() => { \n router.push('/dashboard')\n }, 2333);\n }, [])\n \n return (\n {params.slug}\n \n router.push('/dashboard')}>\n Dashboard\n \n
\n )\n}\n\nexport default page"
},
{
"path": "Video 132/next-navigation-tutorial/app/globals.css",
"content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:root {\n --background: #ffffff;\n --foreground: #171717;\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --background: #0a0a0a;\n --foreground: #ededed;\n }\n}\n\nbody {\n color: var(--foreground);\n background: var(--background);\n font-family: Arial, Helvetica, sans-serif;\n}\n\n@layer utilities {\n .text-balance {\n text-wrap: balance;\n }\n}\n"
},
{
"path": "Video 132/next-navigation-tutorial/app/layout.js",
"content": "import localFont from \"next/font/local\";\nimport \"./globals.css\";\nimport Navbar from \"@/components/Navbar\";\n\nconst geistSans = localFont({\n src: \"./fonts/GeistVF.woff\",\n variable: \"--font-geist-sans\",\n weight: \"100 900\",\n});\nconst geistMono = localFont({\n src: \"./fonts/GeistMonoVF.woff\",\n variable: \"--font-geist-mono\",\n weight: \"100 900\",\n});\n\nexport const metadata = {\n title: \"Create Next App\",\n description: \"Generated by create next app\",\n};\n\nexport default function RootLayout({ children }) {\n return (\n \n \n ![\"Train](\"image.png\")
\n