My First Site

Akil Griffiths
3 min readMar 23, 2021

I noticed I was working on a lot of projects, some I’d even say were finished. Not a single one published, I believed that needed to be changed. I made a portfolio website, so I can test out building a site. I figured a site without a backend would be a nice way to start.

My site doesn’t have a backend because it did not seem necessary. I couldn’t think of many projects that I would want to show on my page, nor did I think it was important to have too many. Didn’t want it to feel bloated. My purpose for the website was to show a little about myself, and show that I know how to code. A couple of projects will give them the idea.

I felt it was important to stick to the basics, not only because they say just keep it simple, but my personal site should reflect me at my core. I wanted to show things I had the utmost confidence in. I am always willing to learn something new but this wasn’t the place for it.

That being said, I definitely did something new with the CSS. I never thought to use two backgrounds like this. I showed a friend and they suggested I think about people’s eyes when I pick my colors. They also opened my eyes to a technique where you give the body a background and give your main div a different one. I like it because it feels like it demands attention like a modal. Back to the basic side of things, making sure I used padding and display correctly so the elements weren’t on top of each other, that they appeared on a horizontal line.

When putting in the images I immediately remembered, that a project I did required me to import the music into the app. To play the music I had to put the files in the public folder of the app, then reference it from there. I assumed I had to do the same here with the images because they were coming from my computer instead of the net. Putting in the pictures was a way for me to demo my understanding of media in react so far.

Made sure I was using best practices when setting up my components. I said earlier I wasn’t going to display many projects, but I thought it was important to design a component that scales well. At the end of the day this is more practice after all. If I decide to do something crazy like show 9 projects and/or change the info, I have the structure for it.

Now I don’t think I’m fully happy with how it turned after really looking at it too write this blog. That is okay, that will just lead to me getting experience working on a deployed site. I was going to add more changes anyways because I didn’t deploy the sites for my other projects yet… This was still a good first step.

Sources

https://mycolor.space/gradient?ori=to+right+bottom&hex=%23DF159B&hex2=%23D7F596&sub=1

--

--