DEV Community

Cover image for My first real project XeroLinux.
Mhmd Ali Hsen
Mhmd Ali Hsen

Posted on

My first real project XeroLinux.

Hello, I'm Mhmd Ali, a Front-End Web developer. in this post I'll share my process of designing and building my first real project XeroLinux.

How it started?

First of all, I watched a video on DistroTube YouTube channel showing the distro, I really liked the distro and how it looks so nice, then I head to the official website to download it, and I realized that the website don't have the same feelings of the distro and I thought that I can do better, so I joined XeroLinux Telegram channel and I sent a message with mentioning DarkXero (the Creator and maintainer of XeroLinux) if he is planning to redesinging XeroLinux website and the answer was YES!

the original design (Before):

XeroLinux Original Design

My redesign Process!

At this point I made a quick mvp with Figma showing my idea to DarkXero, of course no thing is perfect from the first time so I kept tweaking the design for about two weeks until we agreed on this desing below.

the Re-Design (After):

XeroLinux Re-Design

The idea was to make the website looks and feels same as the Distro specifically the XeroCerry rice.

Building the website

Now it's time to build the website, I created the website with ReactJS since it is the language that I'm comfortable, It tooked around 2 weeks to finish it. but the problem was that DarkXero wanted an easy way to update the Changelog, Announcements, Videos and the FAQs without changing the source code, so I made everything he need to update in a json file, except for the Pop Ups because they do not have a single layout or a fixed content, I kept thinking for a solution until I remembered NoteDown, this is a tool/notes web app I've created while I was learning JavaScript to take notes with Markdown syntax with many useful features. Since he knows Markdown I configured the tool to preview Markdown in the same styles for XeroLinux website, click here to try the configured tool.

My experience

It was a good experience, I'm grateful that my first project was something that I love,
and I enjoyed working on it, and DarkXero is an awesome person, I'm happy that I met him.

Thank you for reading, what do you think about it? Any advice would be much appreciate it...

Top comments (0)