My contributions in this year 2020 Hacktoberfest

This week has been a blast, I literally spent 5 days without stopping programming and I had a great time (but I don't recommend it as a lifestyle, for a hackathon is worth xD).

As I've already finished 4 PRs which is the star number of this hackathon (I'm looking forward to planting my tree 😍), I wanted to tell you what I've been doing.

Since I've been contributing little, I wanted to start with technologies that were more familiar to me, so I only had to fight with forks and git origins. That's why I chose to create a feature in https://stylestage.dev/ as my first PR and put into practice my beloved SASS to generate the CSS that was require.

If you still haven't finished your PRs or you want to keep contributing I absolutely recommend you to participate in this project, it's amazing!

Purpleland by Dawntraoz · Pull Request #69 · 5t3ph/stylestage

New Stylesheet Submission: Have you followed the guidelines in our Contributing document? Have you checked to ensure there aren't other files using the same name as yours? Have you filled in at least the required data for title, author, and stylesheet?

https://github.com/5t3ph/stylestage/pull/69

And once it is merge you can see your result live! 😍

https://stylestage.dev/styles/purpleland/

Then, searching among projects with the Hacktoberfest2020 tag, I found one where they were looking to migrate their CSS to LESS with the BEM methodology for their class nomenclature. As I really liked the initiative, I helped them with it. It allowed me to get to know Apache Cordova a bit, since I had never used it before.

Use LESS and BEM implementation by Dawntraoz · Pull Request #29 · Scratch-Client-4/itchy-cordova

Create LESS structure. Add the global packages needed to run LESS compiler and autoprefixer to the Readme and push the generated styles in asset/css folder. Add BEM methodology to name classes and structure LESS code.

https://github.com/Scratch-Client-4/itchy-cordova/pull/29

Once I had gained confidence with the way of working in open source I decided to try out projects I already knew before.

As a huge fan of the work that FrontEndFoxes does for the community of FrontEnd developer women, I decided to contribute to their new website by adding the unit tests setup, first test cases and the CI workflow that won the Runner-Up award at GitHub Actions Hackathon (which I'm very proud of and I was looking forward to implementing it in a real project).

Add CI workflow, jest and basic unit tests by Dawntraoz · Pull Request #26 · FrontEndFoxes/ff-web

Create a CI.yml file to run in each PR/Push to main branch: npm install, npm run lint and npm run test:unit (with coverage included). Add packages need for unit testing in Jest in Vue 3 (@vue/cli-plugin-unit-jest, typescript and vue-jest ^5.0.0-alpha.4) Configure jest to generate coverage when testing.

https://github.com/FrontEndFoxes/ff-web/pull/26

Finally, as expected, I couldn't leave out my dear NuxtJS, so I caught up to see if they needed anything. I was told I could help migrate the documentation from the http module to the new Docs theme and here it is 👁.

docs: migrate from vuepress to nuxt content by Dawntraoz · Pull Request #133 · nuxt/http

Install content docs Add new static assets Migrate content: change alerts and add categories & position Remove vuepress old-docs Add new Netlify configuration Questions: What about the thumbnail template on figma? Where I have to use it? There's a new color palette for this module? Which one?

https://github.com/nuxt/http/pull/133

These weeks I will continue to contribute to the wonderful world of open source and I hope to see you for some PR. May the good practices be with you!