Profile Information

Name : Om Chauhan
Nickname : om-chauhan1
Email: [email protected]
Phone Number: 91-9786398037
Github: om-chauhan1
Linkedin: om-chauhan1
Location: India (UTC 5.30)
Typical working hours: Between UTC 11:00 PM to UTC 4:00 PM

Synopsis

[Programs & Events Dashboard] Improve system for copying courses from one Dashboard to another

The Wikimedia movement has been instrumental in democratizing access to knowledge globally, empowering individuals to both consume and contribute to a wealth of information. Embedded within this dynamic ecosystem, the WikiEduDashboard serves as a vital tool, aiding in the organization of groups to effectively contribute to Wikipedia, fostering collaboration and learning within the Wikimedia community.

Presently, the WikiEduDashboard operates across two main instances: Programs & Events Dashboard and Wiki Education Dashboard. However, a significant challenge arises due to the current course copying feature. When courses are copied between instances, essential content such as Timelines isn't replicated. This limitation inhibits the seamless reuse of assignment plans, particularly from the Wiki Education Dashboard to the Programs & Events Dashboard.

This project aims to fix this problem by enhancing the course copying feature, making it robust to ensure the comprehensive transfer of essential content like Timelines across servers. By improving both frontend and backend components, this project will streamline the process, making it easier for users to replicate courses completely and leverage valuable content across different instances of the WikiEduDashboard. Ultimately, this project helps users to save time and effort, and promotes greater collaboration within the Wikimedia community, making it easier for more people to learn and contribute to Wikipedia.

Possible mentor(s)

@Ragesoss

Have you contacted your mentors already?

Yes

Deliverables

The main objectives of this project are :

1. Improve the course copying feature such that useful Timelines and other content can easily be transferred across servers.
2. Control Access Rights: Allow users (non-admins & admins) to use this feature to copy any course from WikiEduDashboard to the Program and Events Dashboard but non-admins remain restricted from utilizing this feature on WikiEduDashboard(i.e copying from Program and Events Dashboard).
3. Migration of existing frontend from .haml to React Components.

To cover all these objectives a well-defined approach is designed and explained below.

Proposed Approach

The flow will start from the main page of the dashboard :

After clicking on the “Create an Independent Program” button, this modal is displayed to the user :
Note: In this modal, the conditional rendering will be done for the “Copy Course as Program” Component. On the Program & Events Dashboard, this feature is visible to both admins and non-admins but on WikiEduDashboard this is only visible to admins.

After clicking on the “Copy Course as Program” the user is directed to this :

Note: More discussion on improvement of the frontend will be done during the Community Bonding Period.

Backend Enhancements :

The main part of this project starts with the backend like how existing controllers, and services need to be modified to accomplish our objectives. These enhancements will empower our front-end components, making the whole functionality robust to replicate all essential content of courses across servers. All areas of enhancement are explained below :

1. Controller Modification:

The existing controller, CopyCourseController, will be modified such that:

• Logic is written to invoke newly created methods of CopyCourse service based on the incoming HTTP request.
• Access Rights are established: Existing and Newly created methods are segregated based on the user of which role can access them depending on the current instance of Dashboard (i.e. WikiEduDashboard or Program & Events Dashboard).

2. Service Enhancement:

The existing CopyCourse service will be modified such that :

• New Methods will be created to copy essential content like timelines etc. The timeline can easily be accessed with the help of the “course_url/timeline.json” Eg:
  
  https://dashboard.wikiedu.org/courses/Wiki_Education/Elections_and_Voting_Behavior_(Spring_2024)/timeline).json Data of the Timeline will be fetched and successfully stored with its corresponding course upon validation.

• The existing make_copy method will be modified accordingly to call newly created methods of copying things like Timelines, upon its successful completion.

3. Data Transfer Optimization:

Data transfer mechanisms within the CopyCourse service will be optimized to ensure maximum throughput and minimize latency these tasks were performed :

• Following a discussion with the mentor, techniques such as batch processing and optimized data serialization will be employed.
• The code written so far will be analysed to find areas of improvement and optimized accordingly to minimize latency and maximize throughput during the transfer of data across servers.

Frontend Enhancements :

The new design of the course copying page and related components will be finalized during the community bonding phase after discussing it with the mentor. This is done because :

1. Migration from .haml page to React component:

The modified backend will behave as a RESTful API, while the existing .haml page, along with finalized modifications, will be written using React.js. This approach ensures client-side rendering, making frontend components dynamically interactive, reducing the load on the server, and adhering to the Single Page Application (SPA) architecture principles.

2. Integration with Backend REST API:

Once the frontend components are migrated to React.js, they will be seamlessly integrated with the modified backend, which serves as a RESTful API. This integration will be facilitated through asynchronous HTTP requests, allowing frontend components to communicate with the backend to retrieve and manipulate data. Endpoints exposed by the backend API will be invoked from the frontend components to perform actions like course copying and content replication.

Precautions and validations have been diligently implemented for the frontend components to ensure robustness and reliability. Measures have been taken to validate user inputs, handle edge cases, and prevent any unexpected behaviour. Additionally, to address potential issues like debouncing, appropriate techniques have been applied to optimize user interactions and minimize unnecessary requests to the backend. These precautions and validations contribute to the overall stability and performance of the frontend components, ensuring a seamless user experience.

Timeline :

Detailed elaboration of each phase(specified in the timeline) is given below :

Before Mid Term Evaluation

1. User Interface Design Proposal (During Community Bonding Period)
   • Requirement analysis and discussion with the mentor about remaining contents that are taken care of while copying courses except Timeline.
   • Discuss and finalize the whole proposed approach with the mentor and incorporate the changes suggested by them.
   • Discuss about the potential future challenges and ways to overcome them.
   • Discuss the need to improve the UI design of the copy course page and develop and finalize new Figma designs accordingly.
2. Controller Modification
   • Set up access control for admins and non-admins based on the instance of the dashboard.
   • Modify the existing logic to invoke the newly created as well as modified methods of the CopyCourse service.
3. Service Enhancements
   • New methods will be created to copy essential content like timelines
   • The existing make_copy method will be modified accordingly.
   • Data transfer across servers will be optimized and ensure the whole code aligns with Rubocop linting rules.
4. Back-end Unit Testing
   • Unit testing of the backend will be done using existing frontend or tools like Postman.
   • Write unit tests using RSpec for back-end functionality developed so far.
5. Feedback Gathering and Incorporation (Phase 1)
   • Gather feedback from the mentor on the developed functionalities so far.
   • Incorporate feedback and do development accordingly to ensure alignment with user needs and expectations.

Before End Term Evaluation

1. Front-end Implementation
   • Migration from .haml page to React and create components according to the finalised design.
   • Utilize Stylus along with its Rupture utility for style-sheet management, ensuring a consistent and responsive design.
2. Integration of Front-end and Back-end
   • The newly created front end will be integrated with the modified backend through asynchronous HTTP requests.
   • New actions were written to send these HTTP requests and receive responses.
3. Writing Unit and Integration Tests
   • Write Jest tests for created front-end components to validate functionality and ensure consistent behaviour.
   • Utilize Capybara for end-to-end integration testing to ensure seamless functionality across the stack.
   • Conduct comprehensive testing of the entire system developed so far, and cover all possible edge cases.
4. Debugging, Bug resolution and Buffer time
   • Solve all reported issues and bugs found during testing.
   • Tackle all the scenarios in which anomalies can occur in the database and ensure database consistency.
   • Allocate the remaining buffer time to any pending work.
5. Feedback Gathering and Incorporation (Phase 2)
   • Gather final feedback on the implemented functionalities and improvements done so far.
   • Incorporate any final feedback into the project, ensuring that the system meets the expectations and requirements of the users.
6. Documentation
   • Document any challenges faced and solutions implemented during this whole journey.
   • Document all the modifications done to the functionality of copying course completely across servers.

Participation

Throughout the Google Summer of Code (GSoC) program, I intend to maintain an open line of communication with my mentor and the community to ensure steady progress. My primary modes of communication will be through Slack, Zulip, Email, and scheduled video call sessions as necessary. I will also actively participate in GitHub discussions, where I will publish my source code, submit pull requests, and engage in code reviews.
Progress updates will be documented through regular biweekly reports, detailing completed tasks, challenges encountered, and plans for the upcoming weeks. Additionally, I will be available for ad-hoc discussions and issue resolution during my working hours.

About Me

My Education

I am currently pursuing my Bachelor of Technology in Computer Science at Bennett University(The Times Group). I am in the second year of my program.

• Computer Science Engineering | Bennett University | Current *CGPA*:  *9.76 / 10*
• *XII (CBSE) | School 92% | 2021*
• X (CBSE) | School 93% | 2019

Q. How did you hear about this program?

I first learned about the Google Summer of Code program through a senior who participated in a previous year's edition. Intrigued by the opportunity to contribute to open-source projects, I decided to explore it further and eventually became enthusiastic about applying for this year's edition.

Q. Will you have any other time commitments, such as school work, another job, planned vacation, etc, during the duration of the program?

During the duration of the Google Summer of Code program, I will not have any significant time commitments that would impact my participation. My current semester ends in the third week of May, precisely when the official coding period commences. During this long break, I plan to dedicate all my time to advancing this project, aiming to accomplish a significant portion of the coding tasks.

Following this break, my college will resume in August. Despite returning to academic responsibilities, I will ensure consistent progress on the project by allocating 5-6 hours per day on weekdays and 6-8 hours per day on weekends. I am confident in my ability to manage these commitments effectively and meet the project deadlines without compromising on quality or timeliness.

Q. We advise all candidates eligible for Google Summer of Code and Outreachy to apply for both programs. Are you planning to apply to both programs and, if so, with what organization(s)?

I am only applying for Google Summer of Code exclusively with the Wikimedia Foundation.

Q. What does making this project happen mean to you?

Making this project a reality means a lot to me on both a professional and personal level. I am fully committed to dedicating my time, effort, and skills towards its successful completion. As an aspiring software developer, the opportunity to contribute to an impactful open-source initiative aligns perfectly with my career goals. It's not just about writing lines of code anymore, it's about creating something that will touch the lives of millions of people worldwide. Knowing that what I'm building will be used by individuals across the globe fills me with a sense of pride and excitement. Plus, being able to stay connected with this amazing group of people who share my passion for open-source development is something I truly cherish. It's not just about the project itself, but the journey and connections that come with it.

Past Experience

Past Contributions to Wiki Education Dashboard - Link

Future Goals (Post GSOC)

Looking ahead from Google Summer of Code, I see myself as a long-term collaborator with the WikiEduDashboard project. Beyond the summer, I'm committed to supporting and helping our project grow. Here's what I aim to do:

1. Facilitate a smooth transition to React 18: I will work on enabling Strict Mode and addressing any challenges arising from component upgrades. This includes ensuring compatibility with React 18 features and optimizing our codebase accordingly.
2. Enhance testing infrastructure: I will research and implement alternative testing frameworks that better support React 17 and beyond. This may involve transitioning from Enzyme to more compatible solutions like React Testing Library (RTL) to improve the reliability and efficiency of our testing processes.
3. Streamline codebase: I will systematically migrate class-based components to functional components, adhering to modern React best practices. This will involve replacing deprecated APIs, adopting hooks, and refactoring code where necessary to improve maintainability and readability.
4. Optimize bundle size and performance: I will analyze bundle size dependencies and identify opportunities to reduce overhead. This may involve removing unnecessary libraries, optimizing imports, and exploring alternative solutions to minimize the application footprint and enhance performance.
5. Remain actively engaged in community support: I will continue to contribute to issue resolution, conduct thorough code reviews, and actively participate in community discussions. I aim to facilitate a collaborative environment by providing ongoing support and sharing knowledge with fellow contributors.

Coding Skills

1. Proficient Languages and Frameworks:
   • HTML, CSS, JavaScript
   • React (including state management with Redux)
   • Ruby (with Ruby on Rails)
   • C/C
2. Front-end Development Expertise:
   • Experienced in building user interfaces using React.
   • Proficient in managing state with Redux for complex applications.
3. Back-end Development Proficiency:
   • Skilled in server-side development with Ruby on Rails.
   • Familiarity with Node.js for building scalable web applications.
4. Conceptual Understanding:
   • Strong grasp of Object-Oriented Programming (OOP) principles.
   • Knowledgeable about Model-View-Controller (MVC) architecture for designing web applications.
5. Specialization in Full Stack Development:
   • Actively pursuing Full Stack Development as a specialization within the Computer Science field.

Backend Flow Charts

Current Implementation :

After Modification :

Figma link for the proposed designs: Link

Note:

All the designs provided above are not yet finalized, they are just a way to express what the implementation will look like. I am ready to provide more design ideas and ways of implementation and am also open to incorporating any design/idea suggested by the mentor.
The approach and designs will be finalized after discussing with the mentor during the community bonding phase.