• Stars
    star
    355
  • Rank 115,842 (Top 3 %)
  • Language
    TypeScript
  • Created almost 2 years ago
  • Updated about 1 month ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Terminal style portfolio website built with React, TypeScript and Styled-Components.

Terminal Portfolio Website by Sat Naing

Terminal Portfolio Website by Sat Naing

ts Netlify Status Gitmoji

My perfolio website in terminal version developed with React, TypeScript and Styled-Components. Multiple themes supported and keyboard shortcuts can be used for some functionalities.

Blog Post: https://satnaing.dev/blog/posts/how-do-i-develop-my-terminal-portfolio-website-with-react

Features

  • Responsive Design 📱💻
  • Multiple themes 🎨
  • Autocomplete feature ✨ (TAB | Ctrl + i)
  • Go previous and next command ⬆️⬇️
  • View command history 📖
  • PWA and Offline Support 🔥
  • Well-tested ✅

Tech Stack

Frontend - React, TypeScript
Styling - Styled-Components
UI/UX - Figma
State Management - ContextAPI
Testing - Vitest, React Testing Library
Deployment - Netlify

Multiple Themes

Currently, this website supports 6 themes. Type themes in the terminal for more info. terminal-portfolio-themes

Lighthouse Score

Sat Naing Terminal Lighthouse Score

Running Locally

Clone the project

git clone https://github.com/satnaing/terminal-portfolio.git

Go to the project directory

cd terminal-portfolio

Remove remote origin

git remote remove origin

Install dependencies

npm install

Start the server

npm run dev

Inspiration and Credits

Here are some inspiration for this kind of terminal website. Only some features and functionalities are inspired by these following websites. All codes are written on my own.

Author

More Repositories

1

astro-paper

A minimal, accessible and SEO-friendly Astro blog theme
Astro
1,906
star
2

shadcn-admin

Admin Dashboard UI built with Shadcn and Vite.
TypeScript
146
star
3

satnaing.dev

My portfolio & blog website developed with NextJS, TypeScript, and TailwindCSS. Markdown is used for contents. Contents are managed via Forestry headless CMS.
TypeScript
81
star
4

haru-fashion

An e-commerce web application developed with Next.JS (React) + Tailwind CSS for front-end/UI, Context API for state management and Custom REST API for Backend.
TypeScript
74
star
5

next-bookstore

An online bookstore developed using NextJS 13 with appDir and StrapiCMS. (Still in Beta)
TypeScript
67
star
6

haru-api

A RESTful API built with NodeJS, Express, TypeScript. Prisma and PostgreSQL are used as database. This API is developed with Test Driven Development approach.
TypeScript
8
star
7

fylo-website

A landing page website developed with HTML5, Sass and JavaScript. This is a challenge by Frontend Mentor and coded by Sat Naing.
HTML
3
star
8

satnaing

3
star
9

calculator-app-react

A calculator app built with React. This is Progressive Web App (PWA) and includes light/dark theme. This Project is challenged By Frontend Mentor and coded by Sat Naing.
JavaScript
2
star
10

tip-calculator

A tip calculator Progressive Web App built with React (TypeScript). Coded by Sat Naing and Challenged by Frontend Mentor.
TypeScript
2
star
11

group1

TSQL
1
star
12

sequence-memory-game

An online sequence memory test game developed using ReactJS and TailwindCSS.
TypeScript
1
star
13

sem

Java
1
star
14

css-cv

HTML
1
star
15

frontend-mentor-challenges

My solutions of the Frontend Mentor challenges
SCSS
1
star
16

simongame

JavaScript
1
star
17

haru-app

TypeScript
1
star
18

todo-app

A Todo-List Web app built with React (TypeScript), Material-UI, and Redux.
TypeScript
1
star
19

monsters

HTML
1
star
20

test

Java
1
star
21

crwn-clothing

JavaScript
1
star
22

robofriends

JavaScript
1
star
23

react-ecommerce

TypeScript
1
star
24

fylo-parcel

HTML
1
star
25

christmas-website

JavaScript
1
star
26

devcamper-api

DevCamper API built with NodeJS, ExpressJS, MongoDB and Mongoose.
JavaScript
1
star