As my initial portfolio recently turned one year old, I decided to create a new one with all the technologies of the stack I currently use. Thanks for visiting my work, I hope you like it.
This project is a personal portfolio repository created by me to showcase my work. The purpose of the project is to demonstrate my proficiency in various technologies such as Next.js, React, TailwindCSS, and TypeScript. The project also includes instructions for setting up and running the project on a local development environment, as well as deploying it on the Vercel platform. Additionally, I provide a boilerplate for creating similar projects using my personal Next.js+Typescript+Tailwind setup.
This project was created from my personal Next.js+Typescript+Tailwind boilerplate. Feel free to use it if you like it! If you do, please visit my Linkedin to say thanks :grin: remember it helps me a lot ♥
This project was generated with the help of natural language processing and machine learning algorithms. By using AI, I was able to improve the quality and speed of the development process. AI algorithms can analyze vast amounts of data, extract meaningful insights, and provide suggestions for improving the content.
To enhance my practices in developing and eliciting Neumorphism styles for Tailwind, I rely on ChatGPT, a cutting-edge language model that leverages deep learning techniques to produce human-like responses to natural language queries. By engaging with ChatGPT, I gain valuable insights and recommendations on how to optimize my development process. This enables me to pinpoint potential issues and simplify my workflow. Moreover, ChatGPT serves as a useful tool for me to add comments to my code, facilitating better organization and documentation of my work.
To create visually stunning pieces for my project, I utilized both Photoshop and Midjourney, an AI-powered platform that generates images based on certain prompts. With Midjourney, I was able to quickly and easily create unique and captivating visuals that perfectly complemented the overall aesthetic of my project. The platform's AI capabilities also allowed me to experiment with different design elements and receive instant feedback on what works best. Overall, Midjourney was an invaluable tool that helped me bring my creative vision to life.
But wait, there's more. In addition to using AI to develop the project, this same technology was also employed to write the documentation you're reading right now. This approach not only saves time, but it also ensures that the documentation is accurate and consistent. Furthermore, using AI to generate documentation frees up developer time to focus on other important aspects of the project, making the development process faster and more efficient.
Make sure your development environment meets the following requirements:
- Node.js 16.8 or later.
- MacOS, Windows (including WSL), and Linux are supported.
Note: While the pages directory requires Node.js v14 or later, the app directory requires Node v16.8.0 or later.
First, install all the dependencies:
npm install
# or
yarn install
Then, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx
. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts
.
The pages/api
directory is mapped to /api/*
. Files in this directory are treated as API routes instead of React pages.
This project uses next/font
to automatically optimize and load Inter, a custom Google Font.
To learn more about Next.js, 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.
You can check out the Next.js GitHub repository
To learn about tailwind you can checkout Tailwind documentation.
If you need to learn more about typescript don't forget to visit their documentation
The way I deployed my portfolio was by using Vercel Platform from the creators of Next.js.
Check out Next.js deployment documentation for more details.