CollegeApp
year
2022 - Onhold
client
me
project
web application
role
Engineer
Issue №1
Our professor conducted lectures using PowerPoint, but due to potential copyright issues (she used photos without proper permissions, I believe), she refused to share the files directly. Instead, she instructed us to take photos of each slide from her computer. Afterward, our group leader would send these images to our Messenger chat on Facebook. To my understanding, Facebook didn't optimize these images, so when head of group had to upload 20-30 slides of images at once, it felt like my CPU was working overtime to render them all. This was the first sign of trouble. Soon after, another problem emerged, albeit a somewhat subjective one. Our group leader didn't use any hashtags or lecture titles, which made searching for specific content a real headache. After countless moments of frustration, I decided to take matters into my own hands.
Solving
After breaking down the problems I needed to solve, I compiled this list:
Improving Lecture Search: To enhance the accuracy and smoothness of lecture searches, I developed a MongoDB model. This model stores essential information about each lecture, including details about the current lesson, the teacher, and the date it was conducted. This data is presented in a user-friendly table format, supplemented by a link to an image gallery for visual reference.
Uploading Lectures: Since I didn't have access to a home server at the time (although I plan to set one up soon), I needed an online storage solution. After considering various options, I opted for AWS's S3 Bucket. This choice was influenced by its scalability, robust security features, and its reputation for providing an excellent user experience.
Create a user-friendly gallery format for accessing desired lectures: Solving this problem turned out to be relatively straightforward. I opted for a clean and straightforward gallery format, emphasizing the elegance of simplicity in displaying code and lecture content.
Issue №2
Following the successful implementation of the gallery, I was riding high on a wave of satisfaction. However, my unrelenting pursuit of optimization drove me to confront another challenge a few months later. This time, the problem was a language barrier, particularly the medical Polish language. Just as I had done in previous projects, I opted to develop a quiz to address this issue.
Now, you might be curious as to why I didn't employ the current quiz in the previous project. The answer is straightforward: for this project, at very beginning, I decided to utilize the Material UI library. However, it's worth noting that this library can be quite heavy, so much so that you could practically float in orbit around it after building the project. This significant difference in technology and requirements necessitated the creation of a new quiz.
Solving
Now, let's dive into the technical aspects. My journey of problem-solving and structuring the project encompassed the following challenges:
The first hurdle was the daunting task of creating the quiz itself. Sitting down to manually write 200-300 questions for each lesson throughout the entire semester in JSON format seemed like a frustrating experience, especially considering the complexity of crafting each question along with their correct answers. To simplify this, I decided to build a straightforward yet robust quiz constructor.
Next came the actual quiz implementation. Given that I had already structured the questions, my primary focus here was on writing the proper logic for question validation and the flow from one question to the next. Once again, I made use of Redux for managing the state.
The last challenge was the representation of each quiz. At this point, I had only a title, which felt rather uninspiring. To enhance the user experience, I integrated a random image generator from https://picsum.photos to visually represent each quiz. And to top it off, I added a random name generator that draws inspiration from a source like https://random-data-api.com/.
Issue №3
As massage therapists, we were provided with A4 paper filled with massage technical instructions during our lessons. Can you believe it? I despised paper for its fragility and weight. So, I pondered: "Why should I lug around kilograms of paper waste when I can store it online within my project?" And that's when the idea was born.
Solving
Here's how I tackled the technical part and the main problems:
Copying Massage Instructions: To address this issue, I needed to devise a way to create a constructor. The idea was straightforward. Since many massage techniques involve repetitive actions throughout a massage session, I created a MongoDB model that encompassed most, if not all, of these techniques. Yes, adding each hand technique was a somewhat tedious process, but it paid off in the end. To streamline and simplify the creation of massage instructions, I also implemented the React DnD library for a robust, smooth, and user-friendly experience.
Listing all Massages This part was relatively straightforward—it entailed creating a simple list of massage titles.
Regrettably, due to tight deadlines and the need to prepare for exams, I couldn't incorporate images or names this time around. Nevertheless, this optimization effort was a significant step forward in eliminating the burden of paper instructions.
CRA
Express
S3 Bucket
Redux
Redux Thunk
React DND
MUI
CRA
Express
S3 Bucket
Redux
Redux Thunk
React DND
MUI
