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

Overview

💻 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.

Comments
  • Error 21

    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

    opened by picarda 10
  • Could've forked?

    Could've forked?

    Was there something with the original project that prevented you from forking and creating a PR? It could have been a collaborative effort to make Terminal a better project for all, instead of taking it a different route by copying the repo, making minor esthetic modifications and pushing it as your own.

    opened by m4tt72 6
  • Error when i run yarn dev

    Error when i run yarn dev

    $ next dev /root/LiveTerm/node_modules/react-dom/cjs/react-dom-server.browser.development.js:145 var textEncoder = new TextEncoder(); ^

    ReferenceError: TextEncoder is not defined at /root/LiveTerm/node_modules/react-dom/cjs/react-dom-server.browser.development.js:145:19 at Object. (/root/LiveTerm/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6733:5) at Module._compile (internal/modules/cjs/loader.js:778:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10) at Module.load (internal/modules/cjs/loader.js:653:32) at tryModuleLoad (internal/modules/cjs/loader.js:593:12) at Function.Module._load (internal/modules/cjs/loader.js:585:3) at Module.require (internal/modules/cjs/loader.js:692:17) at require (internal/modules/cjs/helpers.js:25:18) at Object. (/root/LiveTerm/node_modules/react-dom/server.browser.js:9:7)

    opened by Jkudjo 3
  • Issue on install using docker compose

    Issue on install using docker compose

    I receive this error upon launching of the website via a browser, this is on the default docker install as shown in the readme:

    Failed to compile

    ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[8].use[1]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[8].use[2]!./src/styles/global.css SyntaxError: /home/node/app/config.json: Unexpected token } in JSON at position 160 at parse ()

    This error occurred during the build process and can only be dismissed by fixing the error.

    opened by undt 3
  • Command Readme doesn't work

    Command Readme doesn't work

    whenever i'm typing the readme command it doesn't even accepts the enter button it's just doesn't work

    here is the readme link i had inserted: https://raw.githubusercontent.com/tassosmak/master/README.md

    opened by tassosmak 1
  • Error while installing

    Error while installing

    yarn install v1.22.19 [1/4] Resolving packages... [2/4] Fetching packages... error [email protected]: The engine "node" is incompatible with this module. Expected version ">=12.22.0". Got "10.19.0" error Found incompatible module. info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

    OS: Linux Mint Una x86_64

    opened by KarmaLikesAxolotls 1
  • Implementing an actual ls?

    Implementing an actual ls?

    Hi, thanks for making this! Do you have any plans to implement an actual ls and mkdir function as opposed to defaulting to a hardcoded response? I want to put personal files on my website and having those would be great. For example, https://github.com/Jaredk3nt/HomeTerm

    opened by sirjohnsonson 1
  • more terminal feature

    more terminal feature

    Will this repo support multi-line feature in future? For example:

    java -Xmx1024M -Xms1024M \
        -jar minecraft_server.1.18.2.jar \
        nogui 
    

    (Maybe this is a little complex, I am trying to add a command parser but failed😥)

    opened by badcodebuilder 1
  • Error on install

    Error on install

    error [email protected]: The engine "node" is incompatible with this module. Expected version ">=12.22.0". Got "10.19.0" error Found incompatible module. info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command. This error occurs when I try to run the first step in the install process, sh -c "$(curl -fsSL https://raw.github.com/Cveinnt/LiveTerm/main/install/install.sh)"

    opened by okcoder2019 1
  • Update scrolling for api commands

    Update scrolling for api commands

    When you run a command such as help, the terminal will automatically scroll down to the bottom of the output and to the next prompt. This doesn't happen for api commands such as weather Miami. This PR changes that and matches the api command behavior to the regular ones.

    opened by mjh316 1
  • Run application with Docker

    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

    opened by diggajupadhyay 1
  • Added credit to homepage

    Added credit to homepage

    added "by cveinnt to the homepage "Liveterm" splash as a link to the liveterm github

    benefit: allows developers to make any github links their own for ease of use by end user

    opened by Morgandri1 0
  • echo command no longer returns html tags

    echo command no longer returns html tags

    Description

    As stated in issue 25, you can insert html tags into the prompt and it will act as intended.

    Fix

    The replace function was used to replace html tags with "". On linux, by default, it does not parse characters like < and would need to escape it. Example:

    2022-06-22-102033_804x217_scrot

    For now it is a simple fix but as the other commands have cheesy responses, maybe instead of "removing" the tags and still outputting the text within them, respond with "Nice try!" ?

    Closes: #25

    opened by dominicbraam 0
  • added feature to exclude commands based on user config

    added feature to exclude commands based on user config

    1. Added function to exclude commands. It basically checks if it is in the excluded_commands list in the config file.
    2. Implemented the above function within:
      • input.tsx for command prompt colour
      • commands.ts so that it would not show the command when help is run
      • shell.ts so that the command does not run
    3. Added a section to exclude the commands within the config file.
    4. Added a section in README.md to help users with the feature.
    opened by dominicbraam 0
  • echo command could expose app for script injection sort of...

    echo command could expose app for script injection sort of...

    if you write echo <a href="https://www.google.com"> this is link </a> on your app, it will show this is link that redirect you to google... I was not able to run javascript code but I can see it could potentially lead to script injection. Or may be it's not that big of a deal... I am not sure ...

    opened by jinseok9338 0
Owner
I like ml, art, and philosophy.
null
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

Gerhard Preuss 123 Dec 28, 2022
A headless starter for WordPress powered by Next.js.

A headless starter for WordPress powered by Next.js.

WebDevStudios 623 Jan 6, 2023
📺 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

Daniel Bayerlein 1.2k Dec 29, 2022
Airbnb UI clone using Next.js + styled-components.

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

Dash Santosh 142 Dec 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

Igor Klepacki 190 Dec 22, 2022
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

Brad Traversy 305 Dec 30, 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.

Andy 5 Jul 27, 2022
Advice API is a full stack fully responsive website made with Next Js for both front-end and for back-end

Advice API Website! Advice API is a full stack fully responsive website made with Next Js for both front-end and for back-end. Table of contents Overv

Sulav Bista 6 Jul 20, 2022
Blogspace - A complete website developed with Next SSR, Typescript, Prismic CMS

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

Guilherme Augusto de Almeida Amaral 8 Dec 21, 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

Harish Garg 163 Dec 29, 2022
Next.js ReCaptcha V3 - Straightforward solution for using ReCaptcha in your Next.js application

⭐ Next.js ReCaptcha V3 Straightforward solution for using ReCaptcha in your Next.js application. ??️ Tiny and Tree-Shakable ?? Written in TypeScript ?

Roman Zhuravlov 8 Dec 7, 2022
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

Vincent Poulain 898 Jan 9, 2023
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

null 0 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

Ruan Correa 2 Apr 27, 2022
A twitter clone website that was built using nextjs

Twitter-Clone this is a twitter clone website that was built using nextjs, then decorated using tailwindcss and to store the data using the firebase r

Mohamad Alghaz Hernanda 4 Jun 23, 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

Jani Tarvainen 30 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

Rishabh 8 Dec 28, 2022
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

Léo Guillaume 23 Dec 28, 2022
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

César Augusto Polidorio Machado 7 Dec 7, 2022