What are you most proud of, and what would you do differently next time?
I am really proud of the flip animation, making the two boxes align was a hassle but it was worth it. I also used this project to practice using a unch of new js tricks like object entries and generally a lot of object related things.
What challenges did you encounter, and how did you overcome them?
Making the two boxes align for the flip animation and making the flip happen in js. I played with the padding and also learnt some new event listeners that helped me solve that part of the code
What are you most proud of, and what would you do differently next time?
I am porud that I was able to develop the API functionality for the backend. This project took so long as it was my first time working with the backend. I plan on redoing this project using a framework next to get more practice in with react
What challenges did you encounter, and how did you overcome them?
Deploying to vercel was incredibly annoying but I found the solution in some youtube videos and with help from AI chat tools, like chat gpt and cursor
What specific areas of your project would you like help with?
My current code causes all users to share the same database, I couldn't figure out how to not have this happen. I tried making a user table to keep user ids but in the end, I couldn't figure it out. I am kind of burnt out with this project as I spent almost two full weeks on it and I really want to do something else. The rest of the code works as intended but if anyone knows how to separate the user data, please I would really appreciate it.
What are you most proud of, and what would you do differently next time?
The nesting feature of sass/scss made designing the theme switching logic much easier and more organized since I only had to change the class on the body.
I also liked how I was able to come up with the calculator logic
What specific areas of your project would you like help with?
My current calculator is very limited. It can only work on two numbers at most and it doesen allo more than one number to have a decimal point. I guess I didn't plan properly for this but I would still like advice on how other people solved that problem. I would also appreciate advice on making the numbers appear with the commas automatically
What are you most proud of, and what would you do differently next time?
I feel like this would have been easier for me to do in vanilla js. I wanted to use this project to learn react. I decided not to overcomplicate things and only use the basics of react that I know. Even then I feel like this project was still confusing. I most likely used a lot of unnecessary code but at least I got it working 🥲
What challenges did you encounter, and how did you overcome them?
Making the theme switcher was a real hassle. I ended up using useEffect and a bunch of conditions in the main App.jsx file to apply the theme swicther globally.
Transferring the search data between components. I solved this by passing the handleSUbmit function as a prop to the Header component that contained the input element so that I could access the value form the parent component.
Handling situations where words don't have certain objects, like no audio or synonym. I just used a tenary conditionals for this.
What specific areas of your project would you like help with?
I couldn't figure out how to automatically search using the synonym button.
I would also appreciate advice on how to plan for react projects more efficiently as I kind of just went in blind with this one using only the basics of react that I knew
What are you most proud of, and what would you do differently next time?
I used this project to practice tailwind because I'm trying to compare it to sass. So far I do prefer scss just because Its easier for me to write but I can see how tailwind can still be useful especially because I don't have to come up with class names. Although there were definitely some things I didn't like. I couldn't make the custom slider using tailwind alone and he re was also the issue of tailwind removing classes that aren't being used at the moment the page loads. I understand that is one of its uses but it did get annoying and I had to define the classes in the input CSS file. Any advice on how to make this process easier will be appreciated.
What specific areas of your project would you like help with?
Advice on how to dynamically add classes using js and tailwind and also how to design the custom slider in tailwind. I also couldn't figure out how to make the custom slider accessible. I.e, I couldn't complete it using my keyboard alone dso I would appreciate advice on this
What are you most proud of, and what would you do differently next time?
Another project I forgot I did. I couldn't out how to automatically calculate the totals while the user is inputting so I added an extra calculate button but aside from that every thing else works more or less as intended
What are you most proud of, and what would you do differently next time?
This project took way longer than I initially expected. My initial attempt quickly became convoluted because I was trying to create components using vanilla JS. After that, I spent the next 3 days trying to use vue and react which both failed as I got lost throughout. I then scrapped the project and started from scratch using vanilla js but building using my strengths and that attempt turned out much better than my first two attempts. I achieved all the functionality defined in the read-me file. I did not write tests though because I'm still learning them and didn't know how to incorporate them into this project. I plan on revisiting it with a framework when I have more practice with them. Using sass for this was also really helpful. I want to practice tailwind on my next project
What challenges did you encounter, and how did you overcome them?
Connecting various parts of the application. I most likely repeated a lot of code that could have been avoided with a framework or library. But I solved it using a lot of for loops.
What specific areas of your project would you like help with?
Any advice on how I would test the application, I don't really know What I would be testing for
What are you most proud of, and what would you do differently next time?
I learned a lot about the prefers color scheme feature of the browsers. I didn't have to add it but I wanted to use this project to practice it. This was also the first time I used scss so it was nice to get some practice in with it. The theme switching checks was also fun to work on. I also practice new ways of naming for styling and scripting, i.e using classes and data-attributes respectively. I am trying to develop a working process that I can follow for future projects. I have gotten better at building toggle buttons and manipulation them too and, the scss really made styling everything a little bit more organized. In the JS file, there may be some repeated code, but that is the only way I currently know how to make a theme switcher.
What specific areas of your project would you like help with?
I would like advice on organizing scss code and what are the best situations to use it in as I just used it to write the entire CSS file, but I don't know if there are better use cases for it.
What specific areas of your project would you like help with?
I really couldn't figure out how to make the label outline while making the check button respond at the same time. It is still completable with a keyboard, but the label toggle its kind of inconvenient.
What are you most proud of, and what would you do differently next time?
It was really good practice for working with carousels. I also got a lot of practice with working with the position property and even overflow surprisingly. The code I use to move slides currently only works for two slide so It would be nice to have more practice with scaling it. It would be fun to make a program that allows the user to input what ever and then see it in a slideshow, while saving the data somewhere.
What challenges did you encounter, and how did you overcome them?
Making the carousel and buttons work with overflow hidden was kind of confusing but I solved it by just adding an extra container to hold the slides. This was so I could still set overflow hidden but It wouldn't cut out the buttons.
What are you most proud of, and what would you do differently next time?
I started designing the page with a smaller screen first and then moved to the bigger screens using media queries. I have found this method works best for me. I couldn't figure out how to automatically select an offer on the index page. I mean, I couldn't record or keep track of the offer I clicked to have it be selected in the select form on the sign up page when the sign up page loads. Making the timer was really fun and probably the easiest part for some reason. I enjoy getting more practice with the date object. I also learned about the problems that can arise with two pages sharing the same js script.
What challenges did you encounter, and how did you overcome them?
I learned a lot about the limitations of select and ended up creating a custom drop down menu that functions like the select, I didn't know how to make a custom styled select using the select tag.
What specific areas of your project would you like help with?
Any help on how to send data between two HTML pages would be helpful.
I also really need help on being more organized on relatively larger projects like this.
What are you most proud of, and what would you do differently next time?
I tried to really make use of the benefits of the two layout tools ( flex and grid). I also tried to focus on readability and eas of editing if need be in the future. I tried to use the BEM notation properly and tried to keep the design as organized as possible and easily followable. Playing with the grids really helped my understnad how columns and rows in the layout work better
What are you most proud of, and what would you do differently next time?
I learned a lot about manipulating display grid and how columns and rows work. I also used a lot of onclick methods on the buttons in the html file and this helped me learn exactly how those work because I never understood them before. This project took longer than I would have liked. I frequently got lost in my styles and scripts, evne though I tried to be more organized. Because of this, its possible, there may be many redundant styles and lines of js code.
What specific areas of your project would you like help with?
Any advice on a more efficient way to connect the buttons and outputs.
What are you most proud of, and what would you do differently next time?
I learned about how useful BEM notation is. It really herlped in making the theme swicth design easier.
I also learnt more about how fetch works and status codes as well as how to access the data in the object.
I couldn't figure out how to automate the theme switcher and wrote each heme indivdually
What specific areas of your project would you like help with?
I would appreciate advice on styling the margin under the image as I could not figure out how to position it like how it is on the design file.
I also didn't add the prefer color scheme as I didn't understand it very well. I will still try though
What are you most proud of, and what would you do differently next time?
I am very proud of how I was able to reuse styles across the board. I'm also starting to like using classes for dom changes instead of inline styles.
What specific areas of your project would you like help with?
I couldn't figure out how to automate the timeframe checking when a timeframe is clicked so instead I wrote the code for each timeframe individually. Any advice on how I could make this code shorter is appreciated. I also had a problem with the page in mobile size. It was overflowing in y and cutting of the top and bottom parts of the page and I don't know why.
What are you most proud of, and what would you do differently next time?
I also added a calculate button since I couldn't figure out how the app was meant to work without the calculator button.
I got lost while writing the js for this project so I went back and rewrote it but with a bit more repetition as I wasn't sure what code did exactly what but the final product is still decent.
I definitely need more practice on planning out the project so I don't get stuck mid way through writing the js code.
What specific areas of your project would you like help with?
I would like some advice on designing those input sections.
What are you most proud of, and what would you do differently next time?
I am most proud of my use of data attributes. I didn't put as much effort into this challenge as I mainly wanted to practice data attributes.
What challenges did you encounter, and how did you overcome them?
Adding an animation to the private message, but I used properties of height and overflow to fix that issue.
What specific areas of your project would you like help with?
I couldn't find a way to add thee red circle at the end of unread messages and I really wanted to move on to a different challenge that uses data attributes, so I never completed that part.
What are you most proud of, and what would you do differently next time?
I am most proud of my use of the clamp function to make the margins, padding and font sizes more responsive. I recently discovered the clamp function and its been really helpful. I am also proud that I was able to reach a decent responsive layout without using media queries as I am trying to rescue my reliance on media queries for responsive layouts.
What challenges did you encounter, and how did you overcome them?
Mainly making the variuos columns respond properly but I used a lot of flex wraps and max widths to accomplish this.
What specific areas of your project would you like help with?
I would like advice on making the keyboard ignore the content behind the overlay when the movbile menu is active while using the keyboard top navigate the page.
What are you most proud of, and what would you do differently next time?
I am most proud of the form validation and the wrapping of the two larger components. I would probably attempt a more effective way for form validation but I am still proud of the current version.
What challenges did you encounter, and how did you overcome them?
validating the email was a challenge but it introduced me to regular expressions which I used to solve that problem.
What specific areas of your project would you like help with?
I would appreciate advice in validating the email in particular. I used a reg expression but I still don't really understand it.
