In part II of this tutorial, we will get this random quote generator working with some jQuery. If you haven’t read part I, I would suggest doing so now as I won’t be covering any styling in this part of the tutorial.
I decided to revisit a project I completed a while ago that displays a random quote from Forismatic. This project is also part of the Free Code Camp curriculum that I have been completing in my spare time. I originally used Bootstrap to help with the layout of the page. I figured I would rewrite it without the help of a CSS framework to lean against, using flexbox. I have made a codepen for anyone who wants to look at the finished product.
I decided to continue with the small flexbox tutorials. So here is another one. In this tutorial, we will make a navigation header using flexbox. If you haven’t read my first post on flexbox, you should check it out here. I have made a codepen of what we will be building. Let’s get started with the HTML.
So, now that I work with a team of web developers, I am constantly learning new things. One of the many new things I’ve learned about, is flexbox. I have to admit, I found it very intimidating at first. I figured I’d make a small tutorial about flexbox using a very simple navigation menu.
Flexbox makes things easier, especially when it comes to centering items. One of the main reasons I use Bootstrap in the majority of my projects is due to it being a pain to layout items and get them centered. Using frameworks like Bootstrap and Foundation help you get up and running quickly. However, most developers (I’ve been guilty of this) don’t go back and remove the unused CSS or use a CDN where most users will have the file cached, but for those who don’t, well it could take a bit more time to load.
So I’ve decided to start a blog and write about my journey of starting a new career. I just landed a job as a Junior Web Developer and I really wish I would have done this sooner! My goal for this blog is to gain a better understanding of the topics that I post about and hopefully help other new developers find their way through the maze of learning to code.
I have chosen to use ghost as my means to accomplish this. I wanted to play around with it before I decided to put it up on a server, so I started off with this repo on Github and typed
vagrant up in my terminal. Assuming you have vangrant, if not, check them out. It was actually quite simple once I figured out the best way to go about installing it. I’m also looking forward to tweaking the default theme and maybe writing out a small tutorial on how I accomplished this.