You are browsing as a guest. Sign up (or log in) to start making projects!

Control Console

  • 2 Devlogs
  • 3 Total hours

a retro style command console!

Ship #1

I programmed Mission Control, a retro-terminal style personal website where you interact by typing various commands. It includes live weather, NASA’S Astronomy Picture of the Day, search on the web, and a simple locally saved todo list.

I’m happy with how the terminal is easy to use, the commands are working smoothly, with a simple design, and feels like a real command line instead of just looking like one.

I didn’t run into many challenges, the command parser was hard to get to work and connecting the APIs so they returned the right data in the terminal took the most time.

Type ‘help’ to see all the available commands. Try weather , apod, search , and the todo commands to test main features.

Try project → See source code →
Open comments for this post

1h 37m 1s logged

Devlog 02 - Building Mission Control

Started building my Stardance project: Mission Control - a retro terminal-style personal website built with HTML, CSS, vanilla JavaScript, and Vite.

The idea is pretty simple: it’s a fake command line interface where you actually type commands into the terminal to do things like search the web, check the weather, view NASA’s Astronomy Picture of the Day, and manage a small todo list.

Building the Interface

I started with a Vite scaffold and the basic terminal HTML already in place, then built everything else on top of it. The terminal uses the VT323 font with the classic green-on-black color scheme to give it that old-school terminal look.

At first I added CRT scanline effects because I thought they looked cool, but after using the site for a bit I realized they just made everything harder to read. I ended up removing them and keeping the design much simpler. Honestly, it looks better this way :)

Making the Terminal Work

The command system works by splitting the user’s input into a command and its arguments before figuring out what to run. I also added command history with the arrow keys, which makes it feel a lot more like a real terminal.

Current commands include:

  • help
  • clear
  • about
  • whoami
  • search <query>
  • weather <city>
  • apod
  • todo add
  • todo list
  • todo remove

Adding Live APIs

The first API I hooked up was the weather command. It uses Open-Meteo to find the city’s coordinates and then fetches the current weather, displaying the temperature and windspeed right in the terminal.

I also added the apod command using NASA’s Astronomy Picture of the Day API. The API key is stored in a .env file, and instead of just returning a link, it displays the image directly in the terminal.

Finally, I added a simple todo system using localStorage, so everything stays saved even after refreshing the page.

Wrapping Up

This is probably the last devlog before I ship. There are still a couple of small things I want to clean up, but it’s finally starting to feel like a complete project :)

0
0
76
Open comments for this post

53m 48s logged

Devlog 01 - Setup

Started my 2nd Stardance project: Control Center - a retro terminal-style website built with HTML, CSS, vanilla JavaScript, and Vite.

The idea is a fake sort of command line interface where typing commands does various things like: search the web, fetch weather, display NASA’s Astronomy Picture of the Day, switch themes, and hide a bunch of cool easter eggs.

I’ve done mostly project setup so far. Cleaned up my repo, fixed my .env.example so my real API key isn’t leaked, and wrote a starter README.md. Nothing flashy yet, but gives me a solid foundation before diving into actual development.

Possible planned commands for now

  • help
  • clear
  • search
  • weather
  • apod
  • todo
  • theme
  • matrix
0
0
3

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…