Building front-end clones of popular web apps is a great way to improve our CSS skills. In this time-lapse, I’m trying my best to build a clone of the Instagram login form in one go. It is not 100% accurate as it was done by eye, but still, it is pretty close.
#learnhtml #learncss #csstips #csstipoftheday #webdeveloper #ui #ux #uidesign #uxdesign #webdesign #html #css #html5 #css3 #csstricks #cssanimation #webdevelopment #frontend #100daysofcss #softwareengineer #javascript #reactjs #nextjs #vuejs #tailwindcss #animation #reels #code #100daysofcode
So I turned this project idea into actual code. Just some simple HTML, CSS (SCSS) and JavaScript code, nothing fancy~! In my lunch break now so thought I would post a quick update on how it's going~! My beautiful Jolyne Kujo portfolio page is coming together nicely~! 😩🙌🏾
Created the repo for this project
Overall structure of the "desktop" GUI look
Completed the login page
JS code behind the taskbar icons (at least 2 of them for now but easy to replicate for the others)
Oooo cool loading screen (was really happy it worked~)
Sticky note thingy? in CSS? cool
Semi-responsive on different screens (curse you mobile screen sizes)
Pop up window for the different sections?!? WHAT (only one right now but easy to replicate for the others)
Jolyne Kujo.
That's all for now and for the rest of my lunch I'm going to watch JOJO~!