From cc7ba255240a8e31845eb394ca2abf9a32ac192c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?C=C3=A9dric=20Niyikiza?= <cedric.niyikiza@student.uclouvain.be> Date: Fri, 6 Dec 2024 13:34:48 +0000 Subject: [PATCH] Delete Report_Cedric-Niyikiza_64492300.md --- Report_Cedric-Niyikiza_64492300.md | 45 ------------------------------ 1 file changed, 45 deletions(-) delete mode 100644 Report_Cedric-Niyikiza_64492300.md diff --git a/Report_Cedric-Niyikiza_64492300.md b/Report_Cedric-Niyikiza_64492300.md deleted file mode 100644 index dd87037..0000000 --- a/Report_Cedric-Niyikiza_64492300.md +++ /dev/null @@ -1,45 +0,0 @@ - -# **LINFO2401 Project Report - Contributing to an Open Source project** -| **Author:** | _Cédric Niyikiza_ | -| ------------------------ | ----------------------------------------------------- | -| **NOMA:** | 64492300 | -| **Academic Year:** | 2024-2025 | -| **Open Source Project:** | [**e-vinci -** _js2_](https://github.com/e-vinci/js2) | -| **Pull request:** | [#14](https://github.com/e-vinci/js2/pull/14) | - - -## Project Selection - -To briefly explain how the project selection process went, it was pretty simple. I already knew that I wanted to work on a web project and implement a feature within the project I was going to select. In addition, I wanted this feature to make sense and to respond to a problem. - -I looked around the repositories of people I knew. And then the idea came to me to contribute to the site/syllabus of a teacher at [*my old school*](https://www.vinci.be/fr/formations/informatique-developpement-applications). - -So I selected a repository from among those initiated by a former Web / JS / React teacher, Raphael Baroni ([Linkedin](https://www.linkedin.com/in/raphael-baroni-0177ab41/) / [Personal Github](https://github.com/e-baron) / [Organization Github](https://github.com/e-vinci/)). - -I had very strong memories of my hours spent on the site of the JavaScript course ... And there was a big problem in my eyes... (My eyes were getting tired...) - -## Project Description - -So my project was to implement the ability to switch between a dark mode and a light mode. This was for the [Javascript course website](https://e-vinci.github.io/js2/) ([*BAC 2 at the Haute Ecole de Léonard de Vinci*](https://progcours.vinci.be/cocoon/cours/BINV2150-2.html)). - -## Journey Trough The Project -So the first thing I did was clone the project (obvious). - -- Attempt to launch the project following the `README.md` provided. - - Right from the start I had minor problems with the version of Node.JS used to compile the project. (Issue resolved thanks to [this solution](https://stackoverflow.com/a/77737680)). - -- Since I wasn't familiar with [Gatsby](https://www.gatsbyjs.com/), I went straight to the web to find out how to simply implement what I wanted. I saw that there was a way out with additional packages, but this strategy wasn't the right one because I didn't even understand how the project was subdivided. - -- So I took the time to look through the project's code and came across the `/scss` folder, which contained the files used to style the site's pages. I'd never used this variant of CSS before, so I was a bit scared at first. Looking in more detail at the files in this folder, I found the file containing the basic colors for the site. So all I had to do was add my color variables for my dark mode. But that wasn't all, I had to manage the style switch within the front-end. - -- To manage the switch, I had to add a button and add a scss file that would override the style of the whole site if the ‘Dark Mode’ button was clicked. - - For the button: Addition of a button in the navbar (management of the dark/light mode state) - - For the style : - - Addition of the `_darkmode.scss` file. Override style so that it makes sense and looks good. - - Import added to `main.scss`, so that the project recognizes these style rules. - -After all these steps, the feature was perfectly functional! 😠- -## Conclusion - -To conclude, I'd say that I'm very satisfied with my contribution. It's allowed me to challenge myself with technologies I didn't know (Gatsby [Framework] and SCSS) and not give up in the face of difficulty. What's more, I'm pleased to have been able to contribute to a project initiated by someone who taught me Javascript and the basics of web development. -- GitLab