My Personal Portfolio Site (v.2.0)

What I built

Here is my cute portfolio site. Here you can find some information about the latest versions of some of the projects I have been working on.

series: [“v.1.0”] is here:

My Portfolio | Hackathon

Fatih Küçükkarakurt ・ Dec 25 '20 ・ 2 min read

#dohackathon

Category Submission:

Personal Site/Portfolio

App Link

https://portfolio-6i53r.ondigitalocean.app/

Screenshots

Description

Hello. I'm Fatih Küçükkarakurt. Actually, I am a civil engineering student. But I have been interested in video games and computers since my childhood. And one day I decided to be a game developer. Although I am on this road in an amateurish way, I learn something new every day.

Actually, this Hackathon was a big step for me. Because I have always developed myself in C, C ++ languages. I opened websites, but I always used WordPress. And one day I thought, why not, I could make a website from scratch. After getting the "Responsive Web Design" certificate from the courses on freecodecamp, I realized how fun this job is.

After seeing the Hackathon announcement, I actually made an app project. A simple photo editing application. But I was afraid of not being able to complete this project. Actually I'm still working on it. You will be able to find it on github soon. Finally, I decided on a portfolio site. Because I wanted to show the game projects I'm working on.

For this, I turned to bootstrap and jquery technologies that I have used before. After working on it for a long time, I realized that I can only see my works with jquery 2.1.1. Yes, only HTML5, CSS3, JavaScript and JQuery are used in this project. I wanted it to be a static site and fast. Moreover, it had to be mobile compatible. Mobile compatibility and speed were important to me. Because I worked intensively on SEO on many blog sites I opened before. I wanted to act with this awareness.

After creating the skeleton structure of the site with HTML5, I came to the CSS3 part, ie the makeup stage. It's going to be funny here, but I read articles by a few famous fashion designers for color palette. Then I realized that I wanted to choose a dark color palette.

I used the following color options intensely;
.#212121
.#909090
.#6b6b6b
.black
.white

After all, I started to like the look of the site. But it was very stable and simple. I wanted to enrich this with animations. For this, I got ideas from codepen, youtube and some personal blog sites. There were crazy projects especially on the codepen. But what I wanted was naturalness and simplicity. That's why I chose animations that would have the least impact on performance and look good.
At this point, -webkit-animations was used extensively.

I thought it was unnecessary and I overwrote index.html instead of writing some pages from scratch. This enabled me to create a different about page in my opinion. So I am happy with this.

Finally;
I wouldn't have thought that a portfolio site development would really get this hard. But there are great developers on dev.to. It was a great pleasure to compete with them. After sleepless nights and intense research, here is my portfolio. I am waiting for your comments. Good luck everyone.

Take care of yourselves. :)

Link to Source Code

https://github.com/fkkarakurt/portfolio

Permissive License

MIT

Background

Actually, it was time to show the projects I was working on. This hackathon has been a sign for me. dev.to is a great place for me. Here I can get help and examine how people improve themselves. That's why I wanted to be in this hackathon event.

Because I did not get software course. I've always tried to learn it myself. This will be a big step for me if I have any success here. My self confidence will increase. This must be a great feeling.

How I built it

This event has contributed a lot to me. I really learned so many different things in the last month. If there are other Hackathons, I will definitely be among the first to join.

I had the chance to review many different JavaScript libraries. I was constantly searching for something new from night to morning. I was asking myself what could I do better. I had to read a lot of articles and watch videos for this. I actually bought a JavaScript book.

Bootstrap, redux, nodeJs, firebase ... These were the technologies I heard about before but did not research enough. I investigated the ways to be followed in order to become a front-end or back-end developer. I researched the stages on these roads one by one. This was a long but comprehensive road. It looked fun but difficult. But that doesn't matter, because I loved software and computers.

Interesting but I even learned time management. I started to produce more practical solutions and my code writing speed increased.

DigitalOcean, thank you. Both for creating such an opportunity and for your support pages. Believe me, the DigitalOcean support pages are like a course. I was able to find everything in there. Moreover, it was very, very easy to distribute this project on DigitalOcean. It was very easy even for an amateur like me. Everything was understandable and clear.Navigating the site and finding something was a breeze.

Moreover, thanks to our $50 gift, I learned many more technologies. I'm sorry but I might have spent a few dollars :) Because I was curious. I created new projects, deleted them. I tampered with the site a little. But it was very useful. I think I will continue to prefer DigitalOcean in my future projects.