DEV Community

Cover image for Terminal Inspired, Clean and Customizable Browser Start Page
Can Cellek
Can Cellek

Posted on • Edited on

Terminal Inspired, Clean and Customizable Browser Start Page

For a long time I wanted to create my own start page looking like my terminal, so here it is! It includes my common bookmarks where I can search through them with my terminal-inspired prompt.

There are multiple ways to customize it, so be sure to check out the repository and wiki page page for customization options.

Start Page animated gif showing some features

Demo

  • You can check the working version from here
  • You can pull the Docker image from here

Features

  • Quickly filter links by typing in the prompt. Hitting Enter will open all filtered links at once
  • If nothing filtered, the text in prompt will use the default search engine for searching your input
  • Launch websites directly from the prompt. Just type the URL (ie. github.com)
  • Search websites with custom commands. For example, type s some weird bug to search StackOverflow for some weird bug
  • Multiple ways to customize the start page to your liking

Built-In Commands

  • Show usage with help command (shows basic usage and your configured search shortcuts)
  • Show info with fetch command (time, date, system and browser data)
  • Update your configuration with config command
    • config import <url> - Import configuration from a URL to your local storage
    • config edit - Edit local configuration within editor
    • config reset - Reset your configuration to default

Key Bindings

  • Clear the prompt quickly with CTRL + C
  • Close window with ESC

Customization

There are multiple ways of customizing the start page to making it yours!

  • Use config edit to edit your configuration within the start page code editor
  • Use config import <url> to import configuration from a URL
  • Change the default configuration in startpage.config.js file and deploy your own version

Please refer to wiki page for more information.

Top comments (6)

Collapse
 
nlxdodge profile image
NLxDoDge

Maybe as a cool feature add a add category name url icon_name, delete name or something and store all the things on the localstorage? So you don't have to add/remove code in order to update it?

To be fair it looks cool, and I once made something like this as well. But the firefox default new page favorites was just to good to pass on for ๐Ÿ˜‹

But I like the CLI part of you project, that's really neat!

Collapse
 
excalith profile image
Can Cellek

Hey mate, I did some attempts for your suggestion but it felt so slow to fill the stuff. So, I decided to make an editor to configure the default configuration easily. Also, created a Docker image, so if you want to try it out it would be easier. Just wanted to thank you for the feedback, it feels more complete now ^^

Collapse
 
excalith profile image
Can Cellek • Edited

Thanks for the feedback, it is indeed an easy way to customize local configurations using the project url instead of getting too technical.

Someone on github asked for a docker container to run it locally. I was thinking about a container for local instances and a new command to import json data to override the default settings. This feature will require some cookies anyway to store configurations, so I can make more custom functions to add / remove and update entries from terminal.

Until I start working on this, I am planning some improvements first, which may change the data structure for configuration and break the configuration files of users. But I can say that project will go towards being more accessable

Thanks again for the feedback, I really appreciate it!

EDIT: If you want, you can open a feature request for it from github.com/excalith/excalith-start...

Collapse
 
mariostopfer profile image
Mario Stopfer

Yup its cool, keep it up!

Collapse
 
excalith profile image
Can Cellek

Thanks mate, really appreciate it!

Collapse
 
polyrux profile image
Polyrux

As someone who can edit html but doesnt know a lick of code, I feel like even following the fork instructions line by line I am too ignorant to get this working. Is there an ELI5 explanation on getting this started anywhere?