Skip to content

A portfolio site that looks and feels like a terminal. Built with React + Tailwind.

Notifications You must be signed in to change notification settings

infiniteltd/terminal-portfolio

 
 

Repository files navigation

image

terminal-portfolio

About

A portfolio site template that looks and feels like a terminal.

Production: https://my-terminal-portfolio.vercel.app/

Installation

git clone https://github.com/thtauhid/terminal-portfolio
cd terminal-portfolio
npm install

Usage

To run the development server:

npm run dev

To build the project:

npm run build

Technologies Used

  1. Vite: Vite is a build tool that helps make your web development faster by providing quick development server and efficient production builds.

  2. React: React is a JavaScript library for building user interfaces. It helps create interactive and reusable components for web applications.

  3. React Hook Form: React Hook Form is a library for managing and validating form input in React applications. It simplifies form handling.

  4. TypeScript: TypeScript is a programming language that adds static typing to JavaScript, making it easier to catch and prevent common errors in your code.

  5. ESLint: ESLint is a tool for identifying and fixing common errors and maintaining code quality in JavaScript and TypeScript.

  6. Tailwind CSS: Tailwind CSS is a utility-first CSS framework that simplifies styling by providing pre-built classes for common styles.

  7. Vercel Analytics: This is a package for adding analytics and monitoring to your web application, often used for tracking user interactions and performance.

Deployment

You can deploy this project to any static site hosting service.

Some of the popular ones are:

Deploying to Vercel

Vercel is a recommended platform for deploying your terminal-portfolio. Here are the steps to deploy your project to Vercel and enable Vercel Analytics:

  1. Sign in to your Vercel account or create one if you don't have an account yet.

  2. Install the Vercel CLI by running the following command:

npm install -g vercel
  1. Authenticate your Vercel account using the following command:
vercel login
  1. Navigate to your project directory:
cd terminal-portfolio
  1. Deploy your project to Vercel:
vercel
  1. Follow the prompts to configure your deployment settings. Make sure to choose a domain name and set up the deployment environment according to your preferences.

  2. Once the deployment is complete, your terminal-portfolio will be live on Vercel, and Vercel Analytics will be enabled by default, providing you with valuable insights into your website's performance.

Deploying to Netlify

Deploying to Netlify can also be a great idea. Considering the fact that they are a large web hosting server as compared to vercel. For deploying to Netlify, we can use two main approaches and we will discuss them in detail.

Deploying to Netlify through the CLI

  1. Bear in my mind that this project is using Vite framework. To make sure you are using the latest Netlify CLI, run the following command in the project terminal: bash npm install netlify-cli -g

  2. Next, in the directory of your project, run the following command to create a new file on Netlify: bash netlify init

  3. In case you are new to Netlify, you will be redirected to create a profile on the platform or you can use your github profile to connect to the platform.

  4. Once netlify is initialized, follow the prompts carefully, select the team option if necessary and then optionally personalize the site name if any.

  5. Go back to the netlify platform on the browser and reload the page.

Optionally deploying to Netlify through GitHub

  1. Upload your project source code to your github profile.

  2. Go to netlify and sign up to the platform using your github profile.

  3. On your netlify page, go to add new site option and select the import an existing project.

  4. Follow the prompts and your project is hosted by netlify. Optionally, you can customize the site if you want.

Contributing

Contributing Guide

Feel free to open an issue if you find a bug or want to suggest a feature.

Hacktoberfest

  1. Star the project.
  2. Join our Discord server to discuss ideas and ask questions.
  3. Please make sure to read the rules before opening a pull request.
  4. The maintainer(s) will add the hacktoberfest-accepted label after reviewing and accepting your pull request.
  5. Refer to the dedicated hacktoberfest project view to see what issues are available to work on.

Contributors

Made with contrib.rocks.

License

MIT License

About

A portfolio site that looks and feels like a terminal. Built with React + Tailwind.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 81.6%
  • JavaScript 8.1%
  • CSS 6.0%
  • HTML 4.3%