💻 LiveTerm - Highly customizable, easy-to-use, and minimal terminal styled website template, powered by Next.js.

Last update: May 13, 2022

💻 LiveTerm - build terminal styled websites in minutes!

Highly customizable, easy-to-use, and minimal terminal styled website template, powered by Next.js.

Building a simple website with LiveTerm only takes minutes, and you only need to work with one file: config.json. After you cloned this repository, simply run yarn install && yarn dev and start editing config.json to build your website!

LiveTerm can be used to build a variety of websites:

Feel free to play with the web demo above!

📸 Showcase


default LiveTerm


my personal website

🚀 Ship your LiveTerm site in less than 5 minutes

First, clone this repository:

git clone https://github.com/Cveinnt/LiveTerm.git

Then, install dependencies:

yarn install

Now you can start developing!

yarn dev

Start editing config.json and try saving and see the updated changes!

📄 Configuration

Basic Configuration

90% of LiveTerm's configurations are done through the config.json file.

{
  "readmeUrl": // create a Github README and link it here!
  "title": // title of the website
  "name": // your name, included in 'about' command
  "ascii": // ascii art to display
  "social": {
    "github": // your handle
    "linkedin": // your handle
  },
  "email": // your email
  "ps1_hostname": "liveterm" // hostname in prompt
  "ps1_username": "visitor", // username in prompt
  "resume_url": "../resume.pdf", // path to your resume
  "non_terminal_url": "W",
  "colors": {
    "light": {
      ...
    },
    "dark": {
      ... // you can use existing templates in themes.json or use your own!
    }
  }
}

Feel free to change it as you see fit!

Themes

You can find several pre-configured themes in themes.json, and you can replace the colors in config.json with the theme color you like! The themes are based on the themes on this website.


different LiveTerm themes

For a better preview of the themes, checkout the images in the demo folder.

Favicons

Favicons are located in public/, along with the other files you may want to upload to your website. I used this website to generate favicons.

Banner

You may also want to change the output of the banner command. To do that, simply paste your generated banner in src/utils/bin/commands.ts. I used this website to generate my banner.

Advanced Configuration

If you want to further customize your page, feel free to change the source code to your liking!

🌐 Deploy on Vercel

The easiest way to deploy a Next.js app is to use the Vercel Platform from the creators of Next.js.

You can install vercel cli and follow the instruction here.

You can also connect your github account to vercel and have vercel automatically deploy the github repository for you.

Credit

Based on M4TT72's awesome Terminal.

GitHub

https://github.com/Cveinnt/LiveTerm
You might also like...

A full stack e-commerce website for learning purposes and built with Typescript, Nextjs, Redux-toolkit, semantic-ui-react

A full stack e-commerce website for learning purposes and built with Typescript, Nextjs, Redux-toolkit, semantic-ui-react

Nov 4, 2021

Text manipulation - Text manipulation website with NextJS, Typescript and Tailwind CSS

Text manipulation - Text manipulation website with NextJS, Typescript and Tailwind CSS

Text manipulation - Text manipulation website with NextJS, Typescript and Tailwind CSS

Apr 27, 2022

A working example of a decoupled implementation using Next.js and GraphQL with the eZ Platform CMS

Decoupled CMS example with GraphQL and Next.js This repository contains the source code for the sample application from the talk "Easy decoupled siteb

Aug 22, 2021

Uber Web Clone using Next.js, React.js, TailwindCSS, Firebase and Mapbox

uber-next-clone Uber Clone using Next.js, React.js, TailwindCSS, Firebase and Mapbox This is a Next.js project bootstrapped with create-next-app. Gett

Mar 26, 2022

Todo list app made with next js, redux and react-beautiful-dnd

Todo list app made with next js, redux and react-beautiful-dnd

Nextodo Todo list app made with next js, redux and react-beautiful-dnd [ Live Demo ] Source code for the demo page can be found on the nextodo repo Co

May 11, 2022

Auth with Next.js - Authentication, Permissions and Payload Rules with Nextjs using ReactJ with Typescript

Auth with Next.js - Authentication, Permissions and Payload Rules with Nextjs using ReactJ with Typescript

Auth with Next.js 💬 About Authentication, Permissions and Payload Rules with Ne

Apr 21, 2022

Online Shopping for Men - An online shopping application built using Next.js and Firebase.

Online Shopping for Men - An online shopping application built using Next.js and Firebase.

Tiptop Description An online shopping application built using Next.js and Firebase. Preview Live Demo See it live here. Features Authentication Wishli

May 17, 2022

[ARCHIVED] experimenting React + GraphQL + Next.js web app on the theme of mindfulness

Relate Relate brings together mindfulness communities, teachers and individuals. Read the article on Medium Made with ❤︎ by Sébastien Dubois Deprecati

Mar 24, 2022

100 lines of code Hackernews reader (with the help of next.js).

About This is an isomorphic react app, displaying stories from hackernews made with super nice next.js. It's just about 100 lines of code. Nothing ser

Apr 3, 2022
Comments
  • 1. Error 21

    Hello, I got this error: ERROR: [Errno 21] Is a directory: 'install' And if I move install.sh at the root I got: ERROR: There are no scenarios; must have at least one.

    Thanks

    Reviewed by picarda at 2022-05-16 01:16
  • 2. Run application with Docker

    I am hoping someone will find this useful. Has added instruction in README too. Simple as it gets.

    Docker build & run time on my machine was (Stat) : real 2m4.055s user 0m0.606s sys 0m0.088s

    Reviewed by diggajupadhyay at 2022-05-15 20:06
200 lines realtime todos app powered by next.js, preact, jet, redux and now
200 lines realtime todos app powered by next.js, preact, jet, redux and now

next-todos About 200 lines isomorphic todos app powered by next.js, redux and Jet realtime. The todos are synced between browsers. The canonical TodoA

Apr 24, 2022
A headless starter for WordPress powered by Next.js.
A headless starter for WordPress powered by Next.js.

A headless starter for WordPress powered by Next.js.

May 12, 2022
📺 Create your own team dashboard with custom widgets. Built with Next.js, React, styled-components and polished.
📺 Create your own team dashboard with custom widgets. Built with Next.js, React, styled-components and polished.

Dashboard Create your own team dashboard with custom widgets. Table of Contents Installation Server Development Production Docker Create a Dashboard A

May 13, 2022
Airbnb UI clone using Next.js + styled-components.

Airbnb UI clone using Next.js + styled-components.

May 12, 2022
🐄 Easy way to generate open-graph images dynamically using Next.js API Routes. Suitable for serverless environment.

Next.js API OG Image · Simple library with purpose of providing easy way to dynamically generate open-graph images using Next.js API routes. If you're

May 17, 2022
Next.js website to list DJ and other musical events
Next.js website to list DJ and other musical events

Next.js website for DJ Events. This is part of my Next.js course on Udemy

May 6, 2022
Meditate - A meditating website to clear your mind. Built with Next.JS and TailwindCSS

A modern meditation web app for you to meditate on your own terms. Track your progress and share your thoughts with others.

Feb 3, 2022
Blogspace - A complete website developed with Next SSR, Typescript, Prismic CMS
Blogspace - A complete website developed with Next SSR, Typescript, Prismic CMS

Título: Spacetraveling Descrição: Um website completo desenvolvido com Next SSR,

Feb 12, 2022
GPT-3 Powered Serverless App using NextJS & React

A Demo GPT-3 Powered Web App, created using NextJS & ReactJS QuickStart Clone this repo update the OpenAI key in .env.local file: Sample .env.local fi

Apr 30, 2022
Bookmark manager on steroid built with React / NextJs / Apollo Tools / Prisma 2 — styled with TailwindCSS 🌱🎺
Bookmark manager on steroid built with React / NextJs / Apollo Tools / Prisma 2 — styled with TailwindCSS 🌱🎺

Tottem is an open source experimentation, it aims combining personal productivity tool approach with (slow) social media capabilities to make users em

May 12, 2022