Flexbox Better

  • 0

Flexbox Better

preview of my flexbox site

Flexbox Better

The first site wasn’t to bad the problem was only the responsiveness. My mentor told me not to fix it. I was confused, why would I not fix it? How would I get better and learn how to properly use bootstrap? He had only one reply.

“Media Queries plus flexbox will solve your problems.”

I had only a few things that came to mind. What is flexbox? How do you even use it? He laughed and said at least you know what media queries are. The assignment was simple, redo my practice-site. However, the catch was to only use barebones CSS, no BOOTSTRAP. I got nervous and wondered how I could possibly do this. I don’t know what the heck a flexbox is, and I only used bootstrap to design and style. He simply told me to figure it out. It was a wake up call, it made me realize that I am at a different level. I don’t really need my hand-held now. Give me a direction an objective and I will figure the rest out.

Getting Somewhere

I opened up CSS Tricks  flexbox documentation and got to work. Once I realized that I was starting to get the concept a little, I knew I would be fine. I was running into big problems just using regular CSS, and creating my own classes. I basically had to finally think while developing the site. It use to be simple for me, place bootstrap here and make changes there than I would be done. This time I actually had to use some type of theory and higher level of thinking.

“How should this be columned?” “How the hell can I make this responsive?” “Why in the hell is this moving this way?” I answered my questions, did the hard work and thinking. Now, I finally created something I am proud of that took a lot of effort and research. I’m glad I got the project and it well… made me better. It allowed me to know I can do this line of work. Also, that I have no choice because of all the frustration I went through just building this site.

 Results

The improved practice-site is fully responsive and better designed in my opinion. I don’t know why maybe its just me, but it seems cleaner. The fact that I used regular CSS along with some jQuery in order to make this says enough for me. I had to actually create the responsive navbar and icon myself.  Yes everything works… but not good enough. I still want to get much better and fluid in developing.

There is so much room for improvement. I could point all the flaws of the new site but you would be reading forever. I won’t use this same template anymore. For now on I will create other designs and personal websites. Just like last time, help me out what can change? What did I miss? How can I improve?

P.S. There is no database or AJAX hooked up to the new site here.

 


Interesting? then talk about it.

Subscribe for any reason!!

For information on posts, and projects in the works, feel free to subscribe. Don't be hesitant and shy to ask me a question via email as well.

Recent Blogs

Topics

Follow me on Twitter!!

LinkedIn Account