Creating Blogs and Learning Web Development

In my journey to learn as much as I can about Full Stack Web Development, I’ve learned many languages and frameworks and build out basic applications like blogs and deployed them to demonstrate what I’ve learned. In this article, I cover many of the blogs I’ve created and what I learned in creating them to show the wonderful world of learning through blogs.

BLOG #1 – Django/PythonAnywhere

This was my first project working with Django and the Materialize CSS framework. After configuring the models and Jinja templates I had to decide how I was going to deploy it. Prior to this my only deployment experience was with static web sites and WordPress using Cpanel so I was a little intimidated by the idea of deployment. After looking into my options it seemed like the best baby step was to use PythonAnywhere which is built for Python deployments. I had created the MySQL database, configured it and got it all up and running.

BLOG #2 – Mezzanine CMS/Linode/NGINX/UWSGI

I learned about difference CMS’s created in Django and learned about Mezzanine CMS and decided I wanted to try it out to practice deployment further. So Installed mezzanine which is pretty robust out of the box. I wanted to add podcasting to it so I added the Django Podcast App to which was also a good way to learn the modularity of Django apps. After I did that I created a VPS with Linode and tried to deploy it using Apache which after several attempts were unsuccessful primarily due to struggles configuring WSGI in the config files. After a few more days of research, I tried to deploy it again using Nginx and Uwsgi and had similar struggles till I discovered my problem was the relative path I was using to my Python virtual environment. I got it up and running after seven days of learning how to set up firewalls, configuring apache and Nginx and so many other trials to get my first deployment with an evergreen ubuntu server.

BLOG #3 – Contentful, NES.CSS, Github Pages/Netlify

So while researching CMS’s created in different languages I learned about the concept of a headless CMS. A CMS that just does data handling allowing you to handle the front end however you like by making API calls. I was still having difficulty understanding fetch and promises in javascript so I felt like this would be a good way to practice. I opened up a free account on the headless CMS, Contentful (another option is Agility CMS) and built out the data model for a blog. After I finished creating some basic posts I spent time reading through Contentfuls documentation and learning how to construct the right endpoint to get my data. After much experimentation, I finally had an endpoint that retrieved the data I wanted and now had to implement it in javascript.

At this point, I’m just about to start my General Assembly Bootcamp and didn’t have much time to play around. As the first couple days pass I keep working on getting the javascript fetch function to get my API and populate a page. In class, we learn how to use Chrome dev tools which certainly sped up the process of testing the fetch calls with console logs and got it going pretty quickly after that. I created a very basic HTML page since just to practice population and deployed it on Netlify (my first netlify deploy) but later created a newer version using the NES.CSS library to give it a gamer vibe, this iteration being deployed on github pages. This was a great project that showed me the use case for a headless CMS, got me comfortable working with API’s and reading their documentation and allowed me to practice Netlify and Github deployments.

BLOG #4 – Mongo/Express/EJS/Node

5 Weeks after the previous blog and into the second unit of the Bootcamp, we begin to learn how to create fully CRUD functional apps using Express and Mongo. After a few days, how all the pieces fit together clicked pretty quickly probably thanks to my previous work with Django and I began work on creating a blog with CRUD functionality using Mongo from the ground up. There are still a few features I’d like to add such as authentication but the blog has CRUD functionality and was built by me from the ground up and was deployed on Heroku in about a few hours, a far cry from the 7 days it took me just to deploy Blog #2, a clear sign of my growing skill level.

BLOG #5 – KOAjs/Node/Mongo

As we learned more about Express in Bootcamp I took a weekend to teach myself another Node framework. I figured Koa would be a good choice as it was created by the creators of Express. I took the opportunity to make a video series on how to create a full-stack application using Koa resulting in this blog.

BLOG #6 – WordPress-Multisite/Google Cloud/Apache/MariaDB

AI learned about Google Cloud and the affordability of using their VM instances for hobby projects so I wanted to explore and learn how to use it, also as my first attempt to use one of the big 3 cloud platforms (AWS, Azure, GCloud). I figured having a WordPress multisite install would be useful whenever I need to create a new WordPress install for different projects. I spun up a Ubuntu 19.10 Server instance, configured WordPress, Apache and MariaDB to have a live WP multisite instance. Also, this allowed me to have successfully set up an Apache server since my last VM effort (Blog #2) used NGINX.

BLOG #7 – Front-End Palooza (Angular, Vue, React, Stencil, Svelte)

As I began to learn the front-end frameworks I figured a good exercise to learn their basic syntax (ajax requests, life cycle methods, props, state, etc.) would be to create different front-ends to the headless blog I created with Contentful earlier. You can find them here:

Angular – Vue – React – Stencil – SvelteGatsby

I’m sure these aren’t the last blogs that I’ll create. I’ll probably make new front ends for my contentful data model as we learn angular and react and we will later create our own CMS from scratch using PHP towards the end of the course… so stay tuned!

Leave a Reply

Your email address will not be published. Required fields are marked *