31–40 of 59 posts
CSS doesn't have to be annoying or boring. Understand the Box Model https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_... I find that a lot of front end developers don't really understand the box model and everything they do is just learned patterns. Once you understand how things are laid out then it becomes so much more fun and easy. Now the hard part is the actual design but I wouldn't say that's your jo…
(Someone needed to tell them.)
This is also like saying. I want to learn how to build an app, is there any way to bypass the annoying part of having a database.
And like saying, is there anyway to bypass writing a front-end user interface.
It’s part of the stack! Just learn it, like you learned everything else. Once you learn CSS and the box model. You will find that it is easier than every other concept in web development.
I bolt together pre-made components.
No CSS required if you’re just bolting together standard components like lists, buttons, menus, and images with accompanying text cards.
My favourite implementation of this is Callstack’s Paper because I can use it for websites and apps.
Demo:
https://react-native-web-paper-example.netlify.app/
Getting started:
git clone git@github.com:callstack/react-native-paper.git
yarn bootstrap
yarn example webI tell them they can use 2d canvas, pixijs, threejs or anything that would work in a browser. Amusingly, I haven't had a single taker in a decade
If your MVP requires a good design with good UX, and you have the budget, someone else can do it for you.
If your MVP does not require a good design or good UX, you can just download some random example and use that.
Keep in mind that using CSS, creating a design and creating a good UX are not the same thing. You can create a terrible UX with a pretty design and lots of cool CSS... Just like you can create an amazing UX and design with minimal CSS.
You get infinite choices on the server (choosing Javascript might seem like a good idea, but its probably going to be the one decision holding you back the most. Ruby (Rails) PHP (Laravel) or Python (Django) would actually probably speed up your development even though you need to learn a new language to use them) but when it comes to the browser its though 3 technologies.
Since you chose React, Material-UI is a great solution but Bootstrap works wonders too. These are CSS frameworks that give you lots of working widgets out of the box that you can just tweak.
Number one best piece of advice for noobie CSS development is to BE EXPLICIT. Write 1,000 more lines of CSS then you have to because you are not trying to be clever and use the cascading nature of css to its full advantage. Instead take every HTML component on your page and give it its own class like "p-tag-45" and then write the css for just that component. It will take you longer, but things will behave the way you want them to. And as you advance your knowledge you can start refactoring it with smarter css where smarter means your web page looks and behaves exactly the same with 200 lines of css instead of 600 lines of css.
Good luck! Most people fail to ship their project. Just get it done and ship it and you are already head above water.
As soon as you decide to make something custom, you will need to learn CSS and several other skills.
I do this at my company (which for whatever reason doesn't like to hire frontend specialists) and we mostly are able to avoid writing any CSS.
[0] https://react-bootstrap.github.io/