CC Open Source Blog

Vocabulary Landing Page & Usage Guide Final Report

gravatar

by Nimish Bongale on 2020-12-03

This blog is part of the series: "GSoD-2020: Vocabulary Usage Guide"

We have reached the end of this wonderful journey. Let's comprehensively recap all my contributions during the GSoD internship period!

Vocabulary Site Updates (Edition 4/4)

After securing acceptance, I received the necessary github invites. I was given write access to the Vocabulary GitHub repository as a CC Vocabulary Core Committer.

Proposed Initial Plan

Project Synopsis

Vocabulary has immense potential to be used as a primary UI component library for website building. What it needs is a robust yet layman-friendly how-to guide. Important developer information such as component guides, usage specifications and configuration tweaks form an essential part of any documentation. This will not only encourage existing users to get a feel of how vocabulary continues to grow and reach new milestones, but also promote the usage of Vocabulary in comparatively newer projects. The desired outcomes of my stint as an intern would not only involve penning out a no-nonsense guide to using the pre-existing components but also the designing and developing of a home page (leading to an integrated documentation for each) for Vocabulary, Vue-Vocabulary and Fonts.

Proposed & Improvised Timelines & Deliverables

Here's a list of all the weekly goals that I met:

Pre-Internship

Week 1 (09/14 - 09/21)

Week 2 (09/22 - 09/28)

Week 3 (09/29 - 10/06)

Week 4 (10/07 - 10/14)

Week 5 (10/15 - 10/22)

Week 6 (10/23 - 10/30)

Week 7 (10/31 - 11/07)

Week 8 (11/08 - 11/15)

Week 9 (11/16 - 11/23)

Week 10 (11/24 - 11/30)

Week 11 (11/30 - 12/05)

Week 12 (12/06 - 12/12)

Week 13 (12/13 - 12/19)

Post-Internship

The Vocabulary Site

Here's the link to the landing site.


All my contributions to Creative Commons!

Fetching dynamic stats from the GitHub API

Here's how the site looks right now:


Snapshot of the final website!
Lighthouse reports
Lighthouse reports for our live site

Core Documentation

Here's the link to the documentation site.

My Learnings And Challenges

Issues & PR's raised during GSoD period

Repository Contribution Relevant links
@creativecommons/vocabulary Developed the CC Vocabulary Landing Page https://github.com/creativecommons/vocabulary/pull/747
https://cc-vocab-draft.web.app
Implemented dark mode for our storybooks https://github.com/creativecommons/vocabulary/pull/806
https://cc-vocabulary.netlify.app
Carried out a monorepo wide documentation revamp https://github.com/creativecommons/vocabulary/pull/813
Wrote the Monorepo Documentation Story https://github.com/creativecommons/vocabulary/pull/785
https://cc-vocabulary.netlify.app/?path=/docs/vocabulary-structure--page#why-is-vocabulary-a-monorepo
Wrote the Grid Documentation Story https://github.com/creativecommons/vocabulary/pull/802
https://cc-vocabulary.netlify.app/?path=/docs/layouts-grid--fullhd#grid-system
Wrote the "Getting Started" Usage Guide https://github.com/creativecommons/vocabulary/pull/774
https://cc-vocabulary.netlify.app/?path=/story/vocabulary-getting-started--page#getting-started
Added a CHANGELOG.md to adhere to OSS conventions https://github.com/creativecommons/vocabulary/pull/671
https://github.com/creativecommons/vocabulary/blob/master/CHANGELOG.md
Unified README.md and updated monorepo build process https://github.com/creativecommons/vocabulary/pull/649
https://www.npmjs.com/package/@creativecommons/vocabulary
https://www.npmjs.com/package/@creativecommons/fonts
https://www.npmjs.com/package/@creativecommons/vue-vocabulary
Configured GitHub native dependabot https://github.com/creativecommons/vocabulary/pull/452
Added phone screen backgrounds https://github.com/creativecommons/vocabulary/pull/445
Introduce Snapshot Testing to Vocabulary using Chromatic https://github.com/creativecommons/vocabulary/issues/735
Add a maintained with Lerna badge https://github.com/creativecommons/vocabulary/issues/807
https://github.com/creativecommons/vocabulary/blob/master/README.md
Add new install size badges for our packages https://github.com/creativecommons/vocabulary/issues/776
https://github.com/creativecommons/vocabulary/blob/master/README.md
Customise individual README's for our packages https://github.com/creativecommons/vocabulary/issues/736
@creativecommons/creativecommons.github.io-source Introductory First Blog Post https://github.com/creativecommons/creativecommons.github.io-source/pull/530
https://opensource.creativecommons.org/blog/entries/cc-vocabulary-docs-intro/
Vocabulary Site Update v1 https://github.com/creativecommons/creativecommons.github.io-source/pull/549
https://opensource.creativecommons.org/blog/entries/cc-vocabulary-docs-updates-1/
Vocabulary Mid Internship Update v2 https://github.com/creativecommons/creativecommons.github.io-source/pull/555
https://opensource.creativecommons.org/blog/entries/cc-vocabulary-docs-updates-2/
Vocabulary Site Update v3 https://github.com/creativecommons/creativecommons.github.io-source/pull/561
https://opensource.creativecommons.org/blog/entries/cc-vocabulary-docs-updates-3/
Vocabulary Site Final Update https://github.com/creativecommons/creativecommons.github.io-source/pull/564
https://opensource.creativecommons.org/blog/entries/cc-vocabulary-docs-updates-closing/
@creativecommons/cccatalog-api Configured GitHub native dependabot https://github.com/creativecommons/cccatalog-api/pull/53
@creativecommons/ccos-scripts Fix file extension in README.md docs https://github.com/creativecommons/ccos-scripts/pull/100

Follow along my complete GSoD journey through these series of posts.

Memorable Milestones Screenshots


GSoD PR merged!


Behold the dark theme!


Grid Documenation Story


Monorepo Structure Story

Conclusion

My GSoD internship has been by far, a very successful and a fruitful one. I thank the the GSoD team for all their efforts in oragnising it this year. I would also like to thank the entire Creative Commons team for all their motivation and support. The onboarding & see-off was very smooth indeed!

Thank you for all your time! This was the final blog post under the Vocabulary docs series. I'll be around for times to come, but until then, sayonara!