DEV Community

Cover image for My contributions in this year 2020 Hacktoberfest
Alba Silvente Fuentes
Alba Silvente Fuentes

Posted on • Originally published at dawntraoz.com

My contributions in this year 2020 Hacktoberfest

In this post I want to tell you how my contributions to Hacktoberfest2020 are going, although there are still 21 days to go!

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 #69

New Stylesheet Submission:

  • [x] Have you followed the guidelines in our Contributing document?
  • [x] Have you checked to ensure there aren't other files using the same name as yours?
  • [x] Have you filled in at least the required data for title, author, and stylesheet?
  • [x] Is the value of stylesheet a full URL that is publicly accessible and renders an unminified, compiled CSS file?
  • [x] Do your styles pass proper contrast for accessibility?
  • [x] Have you included @media (prefers-reduced-motion: reduce) to remove animations on *,*::before,*::after?
  • [x] Did you style the .skip-link?
  • [x] Have you checked on a real mobile device to ensure your responsive design doesn't cause overlaps or overflow scrolling?

Hi :) I read the whole guidelines, I took care and check everything with WAVE extension and my mobile also! If anything else is needed, I'm here to fix it ๐ŸŽ‰

Thanks in advance for this awesome project ๐Ÿ’œ

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 #29

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. PS: Exclude .idea in .gitignore (folder automatically generated by VS Code) Implementation of ISSUE: #23

fix #23

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 #26

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. Start writting unit test for App.vue, Views and Components.

ISSUE: #23

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 #133

  • [x] Install content docs
  • [x] Add new static assets
  • [x] Migrate content: change alerts and add categories & position
  • [x] Remove vuepress old-docs
  • [x] 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?

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!

Top comments (12)

Collapse
 
vaibhavkhulbe profile image
Vaibhav Khulbe

Great work Alba! ๐ŸŽ‰

Collapse
 
dawntraoz profile image
Alba Silvente Fuentes

Thank you so much ๐Ÿ’œ

Collapse
 
natterstefan profile image
Stefan Natter ๐Ÿ‡ฆ๐Ÿ‡น๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป

Great work!

Collapse
 
dawntraoz profile image
Alba Silvente Fuentes

Thank you Stefan ๐Ÿคฉ

Collapse
 
krishnakakade profile image
krishna kakade

Great congrats

Collapse
 
dawntraoz profile image
Alba Silvente Fuentes

Thanks ๐Ÿ’œ

Collapse
 
micahlt profile image
Micah Lindley

Congrats! It was a pleasure to have your contribution on our repository ๐Ÿ˜Š

Collapse
 
dawntraoz profile image
Alba Silvente Fuentes

Oooh, thank you ๐Ÿ’œ I learnt a lot there ๐Ÿค—

Collapse
 
5t3ph profile image
Stephanie Eckles

Yay, congrats! Super pumped you chose StyleStage.dev as one of your 4! :)

Collapse
 
dawntraoz profile image
Alba Silvente Fuentes

Thank you so much ๐Ÿคฉ
The idea and project is amazing ๐Ÿ’œ So proud of being in that list ๐Ÿ’ƒ

Collapse
 
pika1998 profile image
Prafulla Raichurkar

That's great, keep it up ๐Ÿ˜ƒ

Collapse
 
dawntraoz profile image
Alba Silvente Fuentes

Thanks a lot! You too ๐Ÿฆพ