Individual Contributions (Milestone 3) ‐ Ümit Can Evleksiz - bounswe/bounswe2024group11 GitHub Wiki
This document summarizes the work I have done for the Customer Milestone 3.
- Frontend
- Frontend Application Development
- W3C Standards
- Feature Scoping
- Introduced the Tinify Image Compression API.
- Implemented the Profile Photo Upload feature.
- Collaborated with Hasan Kerem on the ideation and implementation of the profile photo upload feature.
- Contributed to the ideation and development of the VoiceOver component for quiz words, assisting Hasan Kerem with its implementation.
- Implemented sound feedback for correct and incorrect answers during quizzes, providing an engaging user experience.
- Developed the Command Menu (EasyAccess) for power users.
- Designed and implemented a new Hamburger Menu for mobile responsiveness.
- Enhanced the Profile feature by adding Interest Tags and English Proficiency selection.
- Ideated the Turquiz achievements and designed 21 unique badges.
- Created the Achievements Database Schema.
- Set up React Router Await-Suspense for improved page loading performance.
- Developed loading skeletons for individual pages.
- Integrated the React Loader Spinner Library for a smoother loading experience.
- Implemented component-scoped data fetching using swr.
- Designed and implemented the Quiz Creation feature with comprehensive form validation.
- Improved the accessibility of new and existing components, ensuring compliance with accessibility standards.
- Designed and developed a new personalized Feed feature.
- Enhanced existing components for improved visuals and accessibility, including the Quiz Card, Forum Card, Leaderboard, Profile Head Section, Toggle Switches, and more.
- Added a popover component to explain Turquiz Points on the profile page.
- Refactored database schemas, eliminating redundant entries.
- Unified the Forum and Quizzes sections for consistent appearance and behavior.
- Implemented server-driven pagination for quizzes and forums.
- Implemented server-driven semantic search for quizzes and forums.
- Assisted Hasan Kerem in designing the "Suggested Forum Questions" card displayed under forum comments.
- Refined the design of the Blocked Users Dialog Popup.
- Added confirmation popovers for destructive actions, such as deleting a forum question or taking a hint.
- Coordinated with the backend team to ensure schema accuracy and alignment with client application requirements.
- Proposed and ideated improved Forum Image visibility and fallback images.
- Implemented search tags and enabled adding interests (tags) directly from the feed.
- Enabled interest removal directly from the profile page.
- Redesigned the profile page to accommodate new features in a more compact and user-friendly layout.
- Developed a new collapsible menu component for the home page targeted at unregistered users.
- Added an English proficiency selector during the registration process and updated the profile page with this feature.
- Populated the database with realistic forum questions, tags, and quizzes using a mix of app interface interaction, local development, scripting, and efficient use of Django fixtures for MySQL.
| Issue Name | Issue Link |
|---|---|
| Populate Database Tags | #892 |
| Distinct Illustrations For Quiz and Forum Creation | #883 |
| Replace Client-Side Sorting with Server-Side Sorting | #879 |
| Shuffle Quiz Choices | #877 |
| Add Follower and Followings to Profile Page | #874 |
| Add Suggested People To The Feed | #873 |
| Implement Sorting for Forum and Quiz Pages for Client | #869 |
| Set Proficiency On Profile | #860 |
| Set Proficiency on Register | #859 |
| Create Generic Collapsible Menu Component | #856 |
| A mysterious quiz card | #853 |
| Load Data From Server For Quiz Review | #850 |
| Turkish Characters Corrupted & Rendered Incorrectly | #846 |
| Connect Leaderboard Page to the Backend | #841 |
| Accessible Collapsible Menu | #836 |
| Profile Page Earned Points Explanation | #835 |
| Quiz Rework | #832 |
| Forum Rework | #831 |
| Implement Accessible and Responsive Hamburger Menu | #829 |
| Quiz Submission Bug | #828 |
| Client Side Pagination & Load More Button for Profile | #824 |
| Fix Z-index Issue On Quiz Type 2 with Hint | #821 |
| Implement Semantic Search On Forum | #815 |
| Display Image Hints as Img | #810 |
| Use Fallback Image on Uploaded Photos | #803 |
| Change in ID Retrieval Method in Backend | #799 |
| Multiple Achievement Popover Overlap | #798 |
| Refine and Enhance Copywriting on Client | #794 |
| Sound Effects on Take Quiz | #791 |
| Implement Receiving An Achievement Notification | #784 |
| Introduce Zustand for Quiz Creation Process | #780 |
| Implement Semantically Related Forum Questions Endpoint | #774 |
| Implement Follow Features on Client Service | #771 |
| Implement Loader For Components | #766 |
| Use SWR for component-scoped data fetching | #765 |
| Take Quizzes Question By Question | #762 |
| Change Quiz Serializer to Include My Latest Answers | #760 |
| Enrich Home Page with Feed Endpoint | #754 |
| Implement Review Quiz Feature | #749 |
| Badges/Achievements Route on Client | #742 |
| Enrich Profile Model to Include Customisation and Gamification | #740 |
| Upload Profile Photo on Register | #737 |
| Add New Sub-Features to Forum | #733 |
| Implement EasyAccess Menu | #731 |
| Add New Sub-Features to Profile | #729 |
| Implement Quiz Creation | #728 |
| Create Achievements Table and Many To Many Relations with Users | #727 |
| Ask Confirmation Before Deleting a Forum Question | #721 |
Add a Child Component to <PageHead />
|
#720 |
| Implement Suspense & Loading Indicators with React Router | #719 |
| Issue Name | Issue Link |
|---|---|
| Ideation: Customisation for Newcomers | #722 |
| Quiz Freeze and Replace Feature Scopping | #730 |
| Create Demo Scenario For Final Milestone | #734 |
| Create and Document Testing Strategies | #818 |
| Populate Database Forum Questions | #893 |
| Design Badges for Achievements | #743 |
| PR Title | PR Link |
|---|---|
| des(client): use distinct illustration for quiz and forum creation | #884 |
| refactor(client): improve loading states on home forum and quizzes | #881 |
| feat(client): server-side sorting on forum and quizzes | #880 |
| feat(client): update proficiency from user profile | #876 |
| feat(client): display follower and following count on profile | #875 |
| feat(client): add and remove interests, suggested tags and people. feed layout improvements | #872 |
| feat(client): add proficiency selection to register | #866 |
| feat(client): customised, configurable home feed | #854 |
| fix(client): no longer reliance on the local storage for quiz answers | #849 |
| feat(client): semantic search for quizzes | #845 |
| feat(client): connect leaderboard to server | #839 |
| ux(client): major accessibility, layout, and design improvements on quiz and forum feed | #830 |
| ux(client): display skeleton screens for route loadings | #826 |
| ux(client): (cmd+K) command menu to access navigation and actions | #825 |
| feat(client): voiceover context & component for pronunciation | #786 |
| feat(client): multistep quiz creation | #764 |
| feat(client): show answers question by question on quizzes | #761 |
| feat(client): add achievements route | #750 |
| feat(des): add all badges to public folder | #748 |
| feat(backend): add achievements model and relationship | #741 |
| feat: implement profile photo upload on register | #738 |
| Test Description | Location |
|---|---|
| Quiz Title Displayed Text | Location |
- Following a session with Suzan Hoca after the demo presentations, we agreed to enhance the client application’s accessibility by improving screen reader support and expanding overall accessibility coverage. You can find the related pull request here: PR #895.
- I took a proactive role in product feature management for this milestone, leading the development of several key features. These include the comprehensive implementation of Achievements & Badges, the New Profile Endpoint (incorporating Interests and Proficiency), the redesigned Feed, and the Easy Access Command Menu.
- Beyond my primary responsibilities in frontend development and adherence to web standards, I also contributed significantly to the backend, database population, and the demo presentation.
- One of my standout contributions is the development of the quiz creation feature, detailed in this pull request: PR #764. This feature introduced global state management, a polished layout and UI, and user-friendly validation. To ensure transparency and effective communication throughout the development process, I included numerous screenshots and screen recordings in the pull request. I estimate the effort required for this feature to be equivalent to several weeks of work for a typical frontend developer.
- For this milestone, I prioritized showcasing the progress and functionality of the implemented features. As a result, I provided extensive visual documentation, including screenshots and screen recordings, across various pull requests and issues.
Number of lines added to the repository.
Number of commits made.
