All solutions

Dear All,

This project is built in below steps

1. HTML - overall working layout with dummy data
2. JS - added intelligence to the code
3. CSS - added styling

Please review and let me know any areas of improvement.

Thanks in advance.

Kind Regards, Vikram

Dear Community,

This is my 1st project from group of JavaScript projects from Frontend Mentor.

I did struggle a lot to complete it, did lots of googling and reading SO posts.

Kindly have a quick look and let me know areas of improvement.

Thanks in advance.

Kind Regards, Vikram

Dear frontendmentor community

Please check the code for any areas of improvements and let me know if there are better ways to do some task or something is wrong practice.

Thanks in advance.

Regards, Vikram

1. Please review code and let me know if I can improve upon any area of code ?

2. This project is built in just 3/4 of a working day, but I feel still there is areas of improvement wrt width, height and grid related techniques.

Thanks in advance.

Dear Community,

Please review code and let me know areas of improvements and optimizations

I couldn't solve below as per design

Didn't get exact icons Design color is not matching with that of provided once. But overall layout is matching with design.

Thanks in advance.

Regards, Vikram

Dear Community,

Kindly review the project and give feedback on below

1. I've hard coded width for mobile layout, is this good practice or there is any other way to handle it ?

2. I've hard coded grid columns width and/or row height, is this fine or there are better ways to handle it ?

3. Any other code optimization techniques please suggest

Thanks in advance.

Dear Community,

Kindly review my 14th project for which I've spent 2 md & lots of hard work, dedication & love.

Please give feedback on below, which I would like to improve upon next project.

Best practices, optimizations

• Grid, Flexbox layouts
• Mobile layout designs
• width, max-width, min-width good practices
• SEO and Accessibility practices
• BEM

This is my 13th project and you can see improvements in deliverables but still I'm struggling with below

• Had difficulties wrt usage of max-width, min-width and width
• Proper usage of either of padding or margin needs improvement
• Had to do lots of fixes post code complete as well
• Semantic tags in HTML needs improvement

Any other improvements or optimization of code; kindly let me know

1. This is my best work till date

2. This project had got loads of head scratchers & found quite tuff to finish

3. Please review & give your comments on below 3.1 Usage of max-width & width 3.2 setting width for grid containers for both mobile and desktop views 3.3 setting column widths in desktop view

1. What did you find difficult while building the project ? 1.1 Lots of components and sub-components to keep track of 1.2 Consistent spacing between elements 1.3 SEO & Accessibility good practices 1.4 Images resizing

2. Which areas of your code are you unsure of ? 2.1 Usage of max-width & width instead of margin or padding values which was causing overflow bug

3. Do you have any questions about best practices ? 3.1 Is SEO tags used correctly ? 3.2 Is Grid layout & flexbox techniques used accurately ? 3.3 Any other areas of improvements ? 3.4 Is image sizing done properly ?

• This project is continuation to improve upon & learn new things related to "CSS Grid" and "BEM"

• I spent time to figure out best way to define row heights

• I'm trying to improve upon SEO and Accessibility of the website, please review code for that.

Any other feedback is highly appreciable, thanks in advance.

Dear All,

I had really difficult time to put circle around social icons, even though I could to it somehow; it's not perfect.

1. Please review and suggest better way of doing it
2. Is there a way to change width, height of "fa" icons ?
3. What are the good practices wrt max-width, width in grid layout ?

Please review code and let me know areas of improvements.

Thanks in advance.

Regards, Vikram

Dear Community,

This is my 2nd project which is implemented with help of CSS Grid Template Area + BEM techniques

Kindly review and give your valuable feedback on below

1. width property usage, best practices
2. deciding row sizes usage, best practices
3. Any other areas of improvement as well.

Thanks in advance.

Kind Regards, Vikram

• I was scared of CSS to death last year, later somehow managed to learn it and bring design to life with loads of trial and error ( just like ~ 1.25 million Indian railway employees try super hard to keep slow moving trains on track and make sure it reaches destination with 1 - 4 hours of scheduled time. I'm an Indian who stayed in Germany for many years and seen how things should be run efficiently )
• Then I found the magic of "BEM" and "Grid Template Areas"
• This is 1st project where I've used "Grid Template Areas"
• I'll highly recommend to use above technique and see the difference with your other ways of styling.
• Usage of Grid template area is like playing Jigsaw Puzzle Game where you first cut design into appropriate pieces and then place pieces in place with template area names.
• With BEM I could play around spacing without worrying about breaking things randomly, in fact I can confidently say BEM is life saver
• I did struggle with placement, spacing etc as it was my 1st project but this technique makes me think differently than flexbox styling, I can avoid position totally and do much lesser padding, margin etc as well

please review code and let me know areas of improvement.

• Please review for BEM and Flexbox best practices
• HTML5 SEO and Accessibility good practices
• I'm breaking down styling into small chunks possible and doing regular commits, which is helping me a lot. You can check those in commits
• Any other suggestion is welcome as well.
• Had faced challenge with placing multiple background images, but could solve it after lots of proper googling and reading answers patiently

1. I've used "BEM" and "Grid" layout first time, along with "mobile first approach"
2. Kindly review the code and let me know areas of improvement.
3. As I'm using "mobile first approach" first time; didn't find much helpful. Please let me know from your experiences is it good way to tackle RWD or starting with desktop first ? About BEM
4. I simply fell in love with BEM, it's like love at first site.
5. I've learnt React and Tailwind CSS, I feel BEM will help you to master both React & Tailwind CSS. It makes life so much easy Your feedback is always welcome, thanks in advance.

Kind Regards, Vikram

I had to struggle with responsive web design styling. It was not as straightforward, need to do lots of trial and error to get things working.

Kindly suggest good practices wrt Responsive Web Design and any debugging techniques, tricks for faster development.

Thanks in advance.

With 3rd project I'm feeling a bit more confident with CSS but still need to learn a lot more. Please review CSS mainly and let me know if any major areas of improvements ?

Earlier I was doing lots of trial and error with CSS but with this project I could able to think ahead and style.

• What did you find difficult while building the project?

1. Ofcourse CSS part
2. Need to do lots of trial and error, googling as well
3. Not able to write CSS as easily / fluently like HTML

• Which areas of your code are you unsure of ?

1. Please review CSS & let me know if any areas of improvement or best practices or easier way to achieve similar results ?

• Do you have any questions about best practices?

1. After seeing design, I draw it on paper and against each of the elements draw rectangle around it. This is helping me a lot to style. As this will help with React as well.

2. Also I've started adding loads of comments in CSS /* Write GOOD comments so that next developer ( killer psycopath who knows where you stay ) ... / / .... who is going to maintain this code; need NOT have to get back to you */

3. Do you suggest any other good practices ? Or comments with above tips ?

I've started my web developer journey with this 1st project, please review and let me know below

1. Good practices wrt HTML - I've used semantic tags as much possible. Is this good enough for SEO and accessibility ?

2. CSS improvements needed - I have always found CSS is difficult to master but I'm slow & steady with my efforts. Please review & let me know good practices, areas of improvement