This project is to demonstrate API integration using node-fetch and axios
node-fetch
# plus
axios
# plus
mui v5
# plus
Next.js 14 with AppRouter (React Server Components Out of the Box)
# plus
Linting
# plus
Formik (Form without the tears) & Yup (Form Validation on steroids)
# plus
React Spinner, because loading shouldn't be boring
# Written in
TypeScriptThis is a Next.js project bootstrapped with create-next-app.
First, install dependencies
npm i
# or
yarn (I recommend)Then, run the development server:
# First,
create a .env file
# then
copy the contents of the .env.example to the .env file
# Finally
npm run dev
# or
yarn dev (I recommend)
# or
pnpm devOpen http://localhost:3000 with your browser to see the result.
Entry to the code (i.e. code that renders the landing page) is at app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Inter, a custom Google Font.
To learn more about Next.js & other technologies used in this application, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
-
- MUI v5 - The complete component library.
- Formik Form - Forms without the tears.
- Yup - Schema builder for runtime value parsing and validation.
- Yup - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.
The easiest way reach me is to Send Me TheCodeNinja254 an Email the creator of this Web Application.
This work is done on a voluntary basis, from me to you, it is an opportunity to learn, grow and excel. I hope it get's you started.