Project goal: Migrate and redesign the Jenkins.io Contributor Spotlight website using Vite.js and React.js to enhance user experience and modernize the tech stack.
Skills to study/improve: UI/UX, JavaScript/TypeScript, Vite.js and React.js, Documentation, Material UI
The current jenkins.io "Contributor Spotlight" feature at https://contributors.jenkins.io/ is in need of a retool to keep it looking sharp and relevant due to its using Gatsby.js as the current framework, which is no longer being actively maintained. The project at https://contributors.jenkins.io/ This project is also in need of modernization tech-stack wise, as we will need to migrate from Gatsby.js to Vite.js and React.js as well as upgrade the versions of most of the dependencies re-used.
UI/UX
JavaScript/TypeScript
Vite.js and React.js
Documentation
Material UI
Migrate the current Gatsby.js based Contributor Spotlight website to Vite.js and React.js
Modernize the tech stack including upgrading React and other dependencies to their latest versions
Redesign the UI/UX of the Contributor Spotlight website including but not limited to:
The landing page
The spotlight profile page
Improve accessibility and responsiveness of the website
Optimize performance and loading times of the website
Document the development and migration process for future reference
Ensure seamless integration with the existing Jenkins.io ecosystem
Engage with the Jenkins community to gather feedback and iterate on the design and functionality of the website
Deliver a fully functional and visually appealing Contributor Spotlight website that enhances the visibility of Jenkins contributors and their stories
Contribute to the Jenkins documentation by providing guides on how to maintain and update the new Contributor Spotlight website
Collaborate with the Jenkins documentation team to ensure consistency in design and user experience across Jenkins.io
Participate in community discussions and share insights gained during the project to foster a collaborative learning environment within the Jenkins community
To get started:
Familiarize Yourself with Contributor Spotlight Development: Review the Contributor Spotlight README.adoc.
Explore Vite.js and React.js: Investigate the official documentation and tutorials for Vite.js and React.js to understand their features and capabilities.
Understand Existing Website Implementations: Study existing websites built with Vite.js and React.js to gather insights into design and functionality.
Engage with the Jenkins Documentation Team: Connect with the Jenkins documentation team to understand the requirements and expectations for the Contributor Spotlight website.
Set Up Development Environment: Prepare your local development environment with the necessary tools and dependencies to start working on the project.
Join Community Discussions: Participate in the Jenkins Gitter channel gsoc-sig to stay updated and seek guidance from mentors and community members.
Plan the Migration and Redesign: Outline a plan for migrating the existing website to Vite.js and React.js, including timelines and milestones for redesigning the UI/UX.
Details to be clarified interactively, together with the mentors, during the Contributor Application drafting phase.