Florian's portfolio/resume site project

-
Today has been an immensely rewarding day! My partner was having a bit of a low day at work, since he is currently actively seeking better fitting employment, and he casually said whether perhaps a website would make his applications stand more out. I reckon he did not expect me to dive headfirst into Bootstrap templates to build him one in a few hours by the time he got back!

Since he is a technical engineer, I wanted to make it a bit thematic and include some animated gears. That was hell of a lot of fun, since my partner immediately stepped into the "client" shoes and demanded the cogwheels to turn fast and ferociously. Luckily I managed to convince him that it would be counterproductive, since it would distract the viewer from the actual content. Now there are slowly, yet surely rotating gears on his personal site, and I swore on my pinky that these gears will be the reason he secures an interview, because they beat boring resumes any day!

Domain shopping went smoothly as ever, .pro domain only cost 3 dollars and hey, why not stroke a technical engineer's ego a bit by making their website PRO by default? :P

Here's the end product: https://florianhaeberli.pro



Things I learned:

  • Bootstrap template modification. This was proper headache at times, I've never had to use so much !important for basic things such as font color. But I guess it's simply one of those things you eventually learn to automatically do. 
  • JS animations. Website implements rotating cogwheels for that thematic touch!
  • responsiveness: font sizes on desktop were entirely too small, so I had to manually go over all of the content to make sure it was easy on the eyes
As a conclusion however, I was pleasantly surprised how quickly and with a few styling additions you can make a beautiful site. Definitely great for customers who don't have a specific artistic vision and just want a functional responsive site. I will however aim to personalise every template I use (such as doing with the gear animations and color scheme on this project), otherwise it feels as impersonal copy-paste. 

This project etched my love for Front End even deeper. I know that a rotating gear animation may seem arbitrary, but when I saw the smiling face of my partner seeing his OWN website incorporating elements that truly make it HIS, I knew it's a job for me. 

Creating joy from pixels!

Comments

Post a Comment

Popular posts from this blog

Defeating the fear of the terminal with React!

-
Image
Today is the day I did it! I opened the ever-feared terminal in my VS code. The final push was looking at React/Angular videos and seeing that following the project all required terminal commands. Since package management is elementary knowledge in this field, I decided I could no longer avoid getting comfortable with it. Aaand of course nothing went smoothly from the beginning. As soon as I tried to create a new file with touch index.html, this happened: Luckily my awesome Facebook coding community quickly came to rescue and pointed out that Window's native terminal "does not speak that lingo". So I had to switch to Git Bash terminal instead, which knows how to touch things. He. He. He. I dove into a React video next, but as if doomed, another problem showed within the first minutes. I was able to install react by: npx create-react-app, but when doing npm start, another error popped up *sigh* A bit discouraging to say the least, just wanting to learn a new ...
Read more

Github and Godaddy domain

-
Image
Today is the day I finally decided to learn the inevitable - Github! A brand new world to be honest. It was intimidating to dive into Godaddy domain settings and Github terminology: "commit", "repository", "pull request" etc. For a newbie, it goes to the dark lands of backend. But combining some resources I actually managed my Godaddy domain anzudev.com  to be hosted by Github on the background, via this repository:  https://github.com/anzuj/anzuj.github.io . So, for the first time in my life, my own HTML+CSS is live with a custom domain. For this day at least, I am the queen. (I'm rejoicing in small things, okay?) Here are the 2 resources that helped me get there: This Youtube video explaining how to set up Github pages This article explaining how to tweak Godaddy settings (in the above video there are namecheap.com settings) I did not use the Git terminal for this, but Windows Powershell. For anyone following (I also commented this ...
Read more

Job offer and Vue

-
Image
Really exciting news - I got an offer of a position to work with an awesome startup! After getting a few rejections due to my lack of professional workplace experience and some frameworks, I was feeling a bit hopeless in regards to what learning curve I still have ahead to be employable, but then I got an unexpected callback by 3 lovely gentlemen who deemed me a good match for my illustration skills, willingness to learn and potentially my startup culture background helped too. We agreed on a 80% mini "internship" for 2 months during which I'll try to wrack up my Vue skills and help make the webapp interactive and visually appealing. It's scary. It's new! But I'll give my very damn best at my first job opportunity in the frontend field! Words can not accurately describe how grateful I am to them for taking this leap of faith in me :) My tasks revolve around using Vue and Vuetify.js with their webapp. They've been in my bucketlist for ages, so what be...
Read more