Building upon your "Book Connect" project in DJS03, you will now dive into Web Components. This challenge will refine your skills in creating reusable, encapsulated, and interactive elements.
🚨NOTE Here you are to continue where you left off in DJS03. This means you must build on your abstractions and work on transforming the Book Preview functionality into a web component🚨
Transform the book preview functionality of the "Book Connect" application into a fully operational Web Component. Additionally, evaluate and potentially convert other parts of the application into Web Components to enhance modularity and reusability.
- Convert Book Preview to Web Component: The main focus is to encapsulate the book preview feature into a Web Component, making it reusable and independent.
- Assess Other Components: Identify other elements within the "Book Connect" app that could benefit from being converted into Web Components.
- Maintain Functionality: Ensure that the application retains all its current functionalities after refactoring.
- Understand the Existing Codebase: Familiarise yourself with the current structure and functionality of the "Book Connect" project, focusing on the book preview feature.
- Create a Web Component for Book Preview:
- Encapsulate the book preview into a Web Component.
- Ensure that the component is self-contained, with its own HTML, CSS, and JavaScript.
- Test the component to ensure it works seamlessly within the app.
- Identify and Convert Other Components:
- Analyse the application to identify other potential components for conversion.
- Prioritise components based on their reusability and importance to the app.
- Convert the chosen elements into Web Components.
- Testing and Integration:
- Rigorously test the new components individually and within the context of the application.
- Pay special attention to interactions between components and the overall user experience.
- Documentation:
- Document the process of creating the Web Components.
- Include any challenges faced and how they were overcome.
- Provide a clear guide on how the components should be used within the app.
Prepare to discuss your experience with your coach, focusing on:
- Challenges encountered while converting the book preview and other elements into Web Components.
- The rationale behind selecting certain elements for conversion into Web Components.
- Insights gained about the advantages and limitations of using Web Components in web development.
Submit your updated "Book Connect" codebase, including all the newly created Web Components. Ensure your code is well-commented and adheres to best practices for Web Component development. Include a detailed report covering your process, challenges, and reflections on working with Web Components.