DEV Community

loading...

Developer Personal Website

ibam profile image Ibrahim ・1 min read

What I built

My personal website which contains all of my information as a Software Engineer.

Category Submission:

Personal Site/Portfolio

App Link

https://ibamibrhm-o2my9.ondigitalocean.app/

Screenshots

Developer Personal Website

Description

Personal Site that contains my profile, blogs, projects, and my resume. Have a dark and light mode. And also have a multi-language feature (English and Indonesian).

Link to Source Code

https://github.com/ibamibrhm/dev-portfolio

Permissive License

MIT License

Background

The purpose I made this project is I need a portfolio website since I don't have any. And I should make the website simple yet contain all the necessary information.

How I built it

I built this project using React.

Tech Stack:

  • React, to create and control components. The heart of this project.
  • Bootstrap, for general style.
  • Styled Components, for making custom style and make light & dark mode.
  • i18next, for making multi-language site.
  • Font Awesome, for the icons.
  • Google Analytics, for knowing visitor behavior on the site.

This project deployed on DigitalOcean App Platform.

Also, this website is a Progressive Web Apps (PWA) using Workbox.

Additional Resources/Info

I optimize the components (using React.memo) and images (using lazy load) to increasing the load speed of the website.
The website also applying Schema Markup and semantic HTML.

Lighthouse Scores:
Lighthouse Scores

Discussion (0)

Forem Open with the Forem app