Frontend Lib Content Components
[Moved to openedx/frontend-app-course-authoring] A library of high-level components for content handling (viewing, editing, etc. of HTML, video, problems, etc.), to be shared by multiple MFEs.
Overview
The frontend-lib-content-components is designed to provide a library of high-level components specifically for handling various content types such as HTML, video, and problems. This library aims to streamline the processes of viewing and editing these content types across multiple Micro Frontends (MFEs), allowing developers to create more consistent and efficient user experiences. Despite being unsupported and no longer receiving updates, the foundational code has been successfully integrated into the frontend-app-course-authoring repository, which paves the way for continued development.
Setting up this library requires a functional development environment, and the provided instructions guide you through the necessary steps to integrate it into your existing workflow. Leveraging these components can greatly enhance the authoring experience, particularly with the introduction of customizable Xblock editors. Even though the gallery view of the editor components may not fully capture all intended behaviors, it's an excellent resource for rapid UI iteration.
Features
- High-level Components: Simplifies the process of viewing and editing various content formats, enhancing development efficiency and user experience.
- Micro Frontend Compatibility: Designed to be shared across multiple MFEs, promoting consistency in content handling.
- Custom Xblock Editor Development: Enables developers to quickly create and configure custom editors tailored to specific content requirements.
- Gallery View: Offers a live demo environment for faster UI-related changes, showcasing editor components with mocked-out data.
- Integration with Studio: Easily integrate new editors into the Studio environment through a series of flags and Django Admin configurations.
- Development Setup Guide: Comprehensive instructions ensure a smooth setup of the development workflow, even for those new to the environment.
- Service Configuration: Clearly outlines the minimum services required to run the library, aiding in effective project management.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Redux
Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.