Way too project-dependent to answer. Since space is usually the concern, figure out which elements are essential and which can be relegated to a menu or removed entirely.
I don't use fixed-size grids, it's too restrictive. I do like to have a centered content area of a fixed maximum width, since it's hard to read extremely wide windows.
As few as possible, obviously depends on design and that may not always be possible but I feel it's best to have a single breakpoint around 480px. Why 480? Because your mobile layout will span 300-480 wide and your desktop breakpoint will span 480-800 or 900. You can have a layout that looks good at 480 that's not cramped at 300, you can have a layout that looks good at 500 that doesn't look empty at 800.
I think it's fine to show/hide a couple of elements with more than one breakpoint too but you don't want to be maintaining 3 or 4 complete separate layouts.
CSS where possible. Not sure where I would have an animation that is only possible with JS. Not counting using JS to change an element's style in order to cause a CSS animation.
SCSS all the time! Here's why a preprocessor like SCSS is indispensable for even small projects:
You can manage your theme colors with variables in one spot. If you decide to tweak some colors, makes updating the project super easy. Also makes sure you are staying on-brand and not using a bunch of slightly different shades.
You can use mixins for compatibility. Instead of having to write multiple lines of CSS for all vendor prefixes each time you use a single rule, you can write out the prefixes once and be cross-compatible with one line (this is especially handy with css grid)
Also minification and comments! It's good practice to comment CSS, but I don't necessarily want my comments to be made public. So a preprocessor helps with that too.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Way too project-dependent to answer. Since space is usually the concern, figure out which elements are essential and which can be relegated to a menu or removed entirely.
I don't use fixed-size grids, it's too restrictive. I do like to have a centered content area of a fixed maximum width, since it's hard to read extremely wide windows.
As few as possible, obviously depends on design and that may not always be possible but I feel it's best to have a single breakpoint around 480px. Why 480? Because your mobile layout will span 300-480 wide and your desktop breakpoint will span 480-800 or 900. You can have a layout that looks good at 480 that's not cramped at 300, you can have a layout that looks good at 500 that doesn't look empty at 800.
I think it's fine to show/hide a couple of elements with more than one breakpoint too but you don't want to be maintaining 3 or 4 complete separate layouts.
CSS where possible. Not sure where I would have an animation that is only possible with JS. Not counting using JS to change an element's style in order to cause a CSS animation.
SCSS all the time! Here's why a preprocessor like SCSS is indispensable for even small projects:
Also minification and comments! It's good practice to comment CSS, but I don't necessarily want my comments to be made public. So a preprocessor helps with that too.