You are browsing as a guest. Sign up (or log in) to start making projects!

My Personal Site

  • 1 Devlogs
  • 7 Total hours

Personalized website I would like to call "experimental" since it was a testing ground for all the new things I learned in the course of building it.

Ship #1 Pending review

This is a personalized experimentation site I created to mostly test out my web dev knowledge. The most challenging bits were getting the text beside image sections and the image scroll feature. I also struggled with position quite a bit too but I quickly found a fix for that. I proud of how I handled this project, learning without AI, taking time to try different things, and particularly about how I can now look at any site and be able to identify the basic elements of it. Its a basic site, so its pretty straightforward, just click and inspect, also, the images are SCROLLABLE!!!

Try project → See source code →
Open comments for this post

7h 3m 40s logged

Alright, I kinda forgot to devlog the whole process and since I was kinda learning mid way too, but its all good. This is a personal website I made for the website mission. I probably spent a whole lot more time here than I needed to, but hey, atleast I learned more than a couple things. along the way.
I did a alot of color mixing on it cause I thought making a uniform site would be way to boring, as such it may look kinda mehh but I like it that way.
Building on the base tutorial, I added background images, borders, specially colored and sized text to the 3 initial sections. I gave them a sea, desert and space theme which I thought looked cool. I achieved that by creating unique ids containing the properties I wanted for them in the CSS style sheet as with other features.
Getting the images beside the text in the second section was pretty problematic cause it either took up all the space or just jumped out of the container entirely until I learned about the flex style which quickly fixed the issue.
For the third section, I used a combination of unordered lists to get everything where I wanted.
Finally the image section, I implemented a scroll feature for this. At first I thought it may need javascript for this, but after a little digging, I found out I could do it with just CSS.
Well thats pretty much it, enough talk, check it out for yourself!

0
0
3

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…