@AyodelearogSubmitted about 1 month ago
Sandaruwan
@Sandaruwan7056All comments
- @emmadumbiSubmitted about 2 months ago
- @E-C-ShackelfordSubmitted 2 months agoWhat are you most proud of, and what would you do differently next time?
I'm most proud of my progress in developing my front-end skills, learning about Sass/SCSS, and implementing SCSS file organization and parameterized mixins for more modular code. Using CSS Grid and figuring out how to create overlapping elements within a grid layout strengthened my responsive design skills, creating seamless transitions between mobile and desktop views. I was also proud to develop a responsive menu toggle that activates a sliding nav panel on mobile and, as an added extra feature, create a scroll-triggered nav effect for quick and easy access.
I enjoyed the iterative process of reviewing and editing my code. Each time I reviewed my work, I spent more time exploring front-end concepts, such as integrating Sass/SCSS, using semantic HTML, implementing CSS Grid, and applying responsive design techniques along with JavaScript.
In reflecting on how I can futher improve and expand my project, I want to learn how I can refine my file structure, improve my mixins and media query management, and expand my use of Sass/SCSS by exploring new concepts I haven't yet learned. I would also like to implement a light/dark theme using SCSS to create a more customizable and user-friendly experience, as well as learn how to optimize the performance of my responsive landing page.
What challenges did you encounter, and how did you overcome them?One of the main challenges I solved was using CSS Grid to build a responsive layout for seamless transitions between mobile, tablet, and desktop devices and create overlapping elements on tablet and desktop devices.
Another challenge emerged in integrating interactive logic with user-friendly design. To work through this challenge, I used JS to create a responsive menu toggle that enables a mobile user to access navigation through a sliding panel. I added an extra challenge of creating a scroll-triggered background change to the navigation, helping me further develop my skills in JS while tending to user experience and ensuring users can access the navigation from anywhere on the page.
I overcame challenges with CSS Grid layout changes, creating overlapping elements, and implementing JS for a responsive menu toggle, sliding nav panel, and scroll-triggered nav changes by breaking tasks into smaller steps, talking through my code, and using trial and error. As I worked on smaller parts, I began connecting the dots and seeing how pieces fit together, which allowed me to identify previous missteps.
What specific areas of your project would you like help with?-
How can I improve the structure of my SCSS files and my use of mixins to make my code more modular and easier to maintain?
-
How can I improve the clarity and logic of my JavaScript for the responsive menu toggle and scroll-triggered nav change?
-
Since this was a smaller project, I placed media queries under specific class selectors for better readability and to keep styles closely related to their elements. If this were a larger project, I would organize media queries by partials, consolidating all related class and mixin changes within each partial's media queries. Do you have any suggestions for optimizing media query organization?
-
- @ochifeogeSubmitted about 2 months ago
- @thibault-devergeSubmitted about 2 months agoWhat are you most proud of, and what would you do differently next time?
I'm super proud of completing my first React project solo (after battling through tutorial hell 💀). Honestly, I wouldn't change much, but I'm totally open to any suggestions you might have!
What challenges did you encounter, and how did you overcome them?Nothing really as the most difficult part was the setup with Vite but that was quite smooth. The challenge is still mostly focus on styling and not heavy on React. I discover CSS-Modules and is quite pleasant to be able to have local scope for css file and keep focus on the code rather than BEM.
That will be my way of styling until i kick on on Tailwind soon I guess.
The setup with Vite was the toughest part, but it went pretty smoothly. The challenge is not really heavy on React and pretty easy styling. Discovering CSS Modules was a game-changer—it’s awesome to have local scope for CSS files, so I can keep my focus on the code without worrying too much about BEM. I plan to stick with this styling approach until I dive into Tailwind soon, I guess!
What specific areas of your project would you like help with?Nothing in particular right now, but I'm open to any suggestions you might have!
- @mudasirNadeemSubmitted about 2 months agoWhat are you most proud of, and what would you do differently next time?
A solution retrospective helps you reflect on your project and share insights with others. For the question, "What are you most proud of, and what would you do differently next time?":
Proud of: Highlight something you did well. Do differently: Mention what you'd improve if you did the project again. This helps others understand your strengths and where you’re looking to grow.
What challenges did you encounter, and how did you overcome them?I encountered a challenge with making the design fully responsive across all screen sizes. Initially, I struggled with some layout shifts and spacing issues. To overcome this, I researched more about responsive design techniques and used media queries to adjust the layout for different devices. I also utilized CSS Flexbox properties to make elements adapt more smoothly. This experience improved my understanding of responsive design, and I now feel more confident handling similar challenges in future projects
What specific areas of your project would you like help with?"I’d like help with improving the accessibility of my project, especially making sure it's fully navigable by keyboard and screen readers. I’m also interested in feedback on the efficiency of my code, particularly in the JavaScript functions. Any tips on optimizing performance or ensuring accessibility compliance would be greatly appreciated."
@Sandaruwan7056Posted about 2 months agonice one keep it up, use media queries to make it mobile friendly
0 - @AndresLamarSubmitted about 2 months ago
- @tushar-RuhelaSubmitted 2 months agoWhat are you most proud of, and what would you do differently next time?
I am most proud of create a contact form using javascript with better functionality and next time I will add more options in this form.
What challenges did you encounter, and how did you overcome them?challenges are come like adding a email validation in this and trim option. and i will overcome them by exploring about form specification.
What specific areas of your project would you like help with?No
@Sandaruwan7056Posted 2 months agoit looks good , try using custom validation messages as in the design
0 - @AdalbertPunguSubmitted 2 months ago
- @ZainabeyySubmitted 2 months ago
- @KSnape34Submitted 3 months agoWhat specific areas of your project would you like help with?
I have tried different ways to do it but I can't figure out why the result section isn't being put into a column on the right.
@Sandaruwan7056Posted 3 months agoim still a beginner but i guess the way u are using media queries is wrong max with 1000px means its for the desktop view and u are using flex direction column thats why the amount area keeps going down . u should focus more about flexbox and responsive design
0 - @mprosper1Submitted 5 months ago
