Liz Lorena Berberena

HomeAll ProjectsCVAboutContact

My First Portfolio

Developed Summer 2017

My first portfolio was a one-page design made with HTML, CSS, Bootstrap, and Javascript. I repurposed a design by Tania Rascia that was freely available for use as a template on her Github. I used some simple jQuery for the projects portion of the website. This was the first stepping stone to making my own complete personal website from scratch.

Screenshot of First Portfolio Attempt

I think this is the earliest screenshot I have from my early attempts at making a website with a proper design from scratch. I tried to go with a minimalist modern design with lots of white space again, but I wasn't happy with the loose and sloppy way the pages behaved. In retrospect, the index page does look pretty cool, and if I only still had the source code I would share it with you over on my Github. In fact, I may try to remake it sometime. I do recall that I used bootstrap to center the elements on the page and make the buttons, so this places this design somewhere in mid to late 2017.

Version 2.2.0 - Late 2017

Screenshot of First Portfolio

Visit SiteSource Code

My first stable portfolio site was made thanks to the work of Tania Rascia, a web developer who makes extremely useful tutorials for web development and design. This particular theme was made available by her for free on her Github.

This theme is a trendy one page theme that looks fabulous on mobile with its sliding menu. Because at this point I was learning about the importance of responsiveness in modern web design, I took apart and reassembled this code with some modifications to learn further. Its simplicity makes it best for a resume-style personal website.

Gif of Use of jQuery on First Portfolio

With this theme I got to experiment with a little bit of Javascript and jQuery, making my project descriptions toggle on and off. I actually started making tons of progress GIFs at this point with ScreenToGif, and it's thanks to that that I'm able to recover bits of my progress to make this blog!

Here's a screenshot of the whole site using the FireShot FireFox extension:

Screenshot of Entire First Portfolio

HomeAll ProjectsCVAboutContactScroll to Top © 2014–2020