Week 2 Progress Update

Introduction

This week has been both challenging and productive as I continued working on improving and contributing to the project. Here, I’ll share my progress, what I’ve accomplished, the challenges I faced, and how I plan to adjust to meet my goals by the end of the term.

What I Have Done So Far

1. 
   

   Focused on Matching Aesthetic Standards:

   
   
   
   
   
   • A significant portion of this week was spent ensuring that the CSS styling of the components aligns perfectly with the current aesthetics of the website.
   
   
   • Matching the website’s established design system required careful attention to detail and iterative adjustments.
   
   
   • This task was more time-consuming than expected, but it was essential to maintain the visual consistency of the project.
   
   
   
   


2. 
   

   Started Writing Unit Tests:

   
   
   
   
   
   • I began creating unit tests for critical components of the project using Jest and React Testing Library.
   
   
   • My main focus has been on components like BackgroundGradient, CardHoverEffect, and FeaturesSection.
   
   
   • These tests ensure that the components behave as expected under various scenarios, such as rendering correctly, responding to user interactions, and handling edge cases.
   
   
   
   


3. 
   

   Collaboration with the Maintainer:

   
   
   
   
   
   • I reached out to the project maintainer on Discord to discuss best practices and clarify doubts about the project structure.
   
   
   • This conversation helped me understand the project’s testing and coding standards better and aligned my contributions with the maintainer's expectations.
   
   
   
   

Challenges Faced

• 
  

  Matching CSS Standards:

  
  
  
  
  
  • Adhering to the existing design system took more time than anticipated due to the complexity of the website’s current styling and animations.
  
  
  • Some minor discrepancies required in-depth research and experimentation with CSS and animations to achieve the desired look and feel.
  
  
  
  
  
  



• 
  
  

  Writing Comprehensive Unit Tests:

  
  
  
  
  
  • Creating detailed test cases that cover all edge scenarios was challenging, particularly for components with conditional rendering and animations.
  
  
  • Understanding how animations and event handlers integrate into the testing framework required additional research.
  
  
  
  
  
  

What I Have Figured Out

• 
  

  CSS Research and Debugging:

  
  
  
  
  
  • I have developed a better understanding of how to debug and refine CSS to achieve pixel-perfect alignment with existing styles.
  
  
  • Experimenting with various CSS properties and consulting design resources helped me resolve many styling challenges.
  
  
  
  
  
  



• 
  
  

  Unit Testing Workflow:

  
  
  
  
  
  • After some trial and error, I successfully set up Jest and React Testing Library for the project.
  
  
  • I now have a clear framework for structuring test cases and ensuring all essential behaviors are covered.
  
  
  
  
  
  

Adjusting to Meet My Goals

To stay on track and achieve my goals for this project, I will:

• Dedicate specific time blocks to focus on completing the unit tests.


• Monitor my progress closely and make adjustments to my plan if needed.

Conclusion

This week has been an excellent opportunity to learn and grow while tackling real-world challenges in a collaborative project. While progress has been slower than anticipated in some areas, I am confident that the foundation I’ve built will allow me to move forward effectively.

I look forward to completing the unit tests and ensuring that my contributions align perfectly with the project’s standards.

Stay tuned for more updates next week as I aim to wrap up the unit testing phase and explore additional opportunities to enhance the project!