CSS Flex, Custom Properties, maintaining simplicity

Community feedback

• 

  P

  Justin Connell•720

  @justinconnellPosted 10 months ago

  Hi Daniel, Your solution looks great on mobile and desktop resolutions - your code is well structured and readable - I can tell at a glance what's going on - so great job on that front.

  Something tells me you're already familiar with the general principles of clean code, you can tag me if I'm wrong - but since you asked, using a well defined methodology such as BEM will help you discover a method for naming and organising your CSS classes.

  Personally I think you're doing the right thing by honing a very strong base in HTML and CSS, this will stand you in good stead in your career going forward.

  Keep it up, I like your style.

  Marked as helpful

  1

  ---

  

  Daniel•130

  @tenczowyPosted 10 months ago

  @justinconnell I have seen people using BEM methodology on youtube videos but didn't really understood the concept behind this so I am glad for the link provided. I will certainly do my research on that one and try to implement this methodology in my future projects. I am always happy to recivie meaningfull and honest feedback so thank you for taking your time on reviewing my project.

  1
• 

  Petrit Nuredini•2,860

  @petritnurediniPosted 10 months ago

  Congratulations on completing your projects! It's a significant achievement, and you should be proud of the work you've put in. Here are some best practices recommendations to help you refine your skills further:

  • Code Organization: Make sure your code is well-organized. Use comments to segment your CSS and JavaScript files, making it easier to navigate through your code. Organizing your code into sections (like header, main content, footer, etc.) can be very beneficial.

  • DRY Principle: Follow the Don't Repeat Yourself (DRY) principle. If you find yourself repeating the same code, consider creating reusable classes or functions. This approach not only saves time but also makes your code easier to maintain.

  • Semantic HTML: Continue to use semantic HTML elements as they provide better accessibility and help with SEO. Elements like <article>, <section>, <aside>, and <nav> give meaning to your content.

  • Responsive Design: Ensure your website is fully responsive. Test on various devices to guarantee a seamless user experience. Using relative units like em or rem and media queries can greatly improve responsiveness.

  • Cross-Browser Compatibility: Test your website on different browsers to ensure it works consistently across all of them. Sometimes, what works on one browser might not work the same way on another.

  • Performance Optimization: Optimize your website for performance. Compress images, minify CSS and JavaScript, and leverage browser caching to reduce load times.

  • Accessibility: Aim for greater accessibility. Use alt tags for images, ensure adequate contrast between text and background, and use ARIA labels where necessary.

  • Version Control: If you haven't already, start using a version control system like Git. It’s a great way to track changes, experiment with new features, and collaborate with others.

  • Continuous Learning: The field of front-end development is always evolving. Keep learning new technologies, frameworks, and best practices. Websites like MDN Web Docs, freeCodeCamp, and CSS-Tricks are great resources.

  Remember, every project is a learning opportunity. Keep experimenting and pushing your boundaries. The more you code, the better you become. Keep up the great work, and I'm excited to see what you create next!

  Marked as helpful

  0