Building My Site (Version 1)

Posted

Edited on May 5, 2020

My site is no longer built as this post describes.

I've redesigned and rebuilt it using GatsbyJS. You can read about why I killed my old site and my experience with rebuilding it, but if you'd like, you can continue reading the original post below.

My obligatory "Hello World" post!

I built this site from the ground up as an exercise in learning full stack development and exploring current web technologies. I studied Electrical Engineering in school, and although I currently work as a Software Engineer, I haven’t had much exposure to developing software for the web until I stumbled upon Colt Steele’s “Web Developer Bootcamp” course on sale at Udemy.

This course provided many mini-projects and was a solid introduction to many topics, such as:

  • An overview of the HTTP protocol
  • HTML, CSS, & client-side JavaScript
  • Using Node.js and developing server-side JavaScript
  • Developing web applications with the Express server framework
  • The Bootstrap library
  • MongoDB

I’ve always wanted my own personal corner on the internet where I could write and post photos, so I bought this domain and started to build my site once I completed most of the course.

At the time of writing this post, my web application is built with the technologies I learned in the course (NodeJS, Express, Bootstrap, & MongoDB), and I deployed everything to a Google Cloud Compute Engine instance. Here are some of the features that I’ve created so far:

  • Storing information about posts and photos (eg: tags & captions/short text) in a MongoDB database (running on a free mLab database server) and using Mongoose to query the database.
  • An admin console to manage posts and photos.
  • Using a WYSIWYG editor to easily add style to my posts from the admin console.

Here are some screenshots of both the public facing site and the admin console:

Public Facing Site

The Admin Console

I think this project was a good first step, but I have more ideas that I hope to implement in the future. I'll need to look into Let's Encrypt to enable HTTPS, and I'll also want to figure out a better method of processing and handling images. There's still a lot more that I hope to add to this project. Whenever I get around to exploring these ideas, I’ll make sure to write more about them. Thanks for stopping by!