19. Next.js Tutorial (6). Examples (1) Login Form

 1. Create the application

Execute this code in the console window of Visual Studio

npx create-next-app@latest my-app12-login-form --ts
cd my-app10 
npm install @mui/material @emotion/react @emotion/styled 
npm install react-bootstrap bootstrap // Bootstrap
npm install formik --save // Build forms




Comentarios

Publicar un comentario

Entradas populares de este blog

14. Next.js Tutorial (1)

 1. Introduction. (No Next.js) Basic example. Load React, React-Dom, and Bable from unpkg.com !-- index . html --> < html > < body > < div id = "app" > </ div > <!-- React--> < script src = "https://unpkg.com/react@17/umd/react.development.js" > </ script > <!-- React-DOM --> < script src = "https://unpkg.com/react-dom@17/umd/react-dom.development.js" > </ script > <!-- Babel Script --> < script src = "https://unpkg.com/@babel/standalone/babel.min.js" > </ script > <!--script type="text/javascript"--> < script type = "text/jsx" > const app = document . getElementById ( ' app ' ) ; ReactDOM . render ( < h1 > Develop . Preview . Ship . < / h1 > , app ) ; </ script > </ body > </ html > Three dependencies are enclo
Leer más

18. Next.js Tutorial (5). Deploying. HTTPS

1. Deploying and running the applications If you want to execute the application in a Node.js server, as far as I know, follow theses steps:  1. Execute npm run build , and verify there is no errors. 2. Try to execute the application in the 2 ways:     2.1 Development mode: npm run dev  and     2.2 Production mode:  npm run start    Verify that the application runs OK in both cases! 3. You must copy all the contents of the project folder (in my case my-app10) to another folder in the server , then, execute  npm run start and verify that   the application works. But it runs HTTP! If you want to change the port of the server, change the " start " parameter in the package.json file as follows: "start": "next start -p $PORT " where $PORT is the desired port (for instance 3001, 8080 ..) 2. Alternatively running HTTP. Using server.js After you have copied the development folder to the server, follow these steps: 1. Create the file   server.js  in the my-app10
Leer más