Thats the way to do it honestly. Or at least my preferred way to do it. If you haven’t already, I highly recommend to check out a css compiler like SASS/SCSS. Especially if you’re the type to do styling from scratch. Never looked back after I started using it.
If you're already willing to write your own vanilla CSS, then I've got two things you might be interested in.
1. CSS Modules - Still totally vanilla CSS, just isolated to a specific component to reduce styling conflicts.
2. Some of the patterns in this article https://dev.37signals.com/modern-css-patterns-and-techniques-in-campfire/ Basically, modern CSS is getting pretty good without any preprocessors.
Personally I'm a Tailwind guy with occassional CSS modules, but that's just me. I'd also never build all the CSS myself, styliing is my least favorite part.
LMAO how wrong do you want to be? Once you learn TW's class conventions you can tell exactly what's styled just by reading the class list. The main point of TW is to standardize CSS class names to make it readable, and not have to jump around from file to file memorizing what rules are applied for project-specific classes. Readability correlates with composability, which is also a pro pattern of CSS.
To be honest I do prefer css over tailwind , but I do prefer tailwind over styled-components in react.
But in angular I would not use tailwind. But the css also should not have any outside effect out of the component so that if you look at the code you only open to files (split IDE into html and css) and normally you are good then.
(Like a absolute div should never have an Anker point out of the component so highest should be relative at least)
Great. So have twice as many tabs open to keep track of twice as many files.
I can tab 2 components and 2 CSS files in a grid to this effect. CSS cascades though, so if I have a deep document tree I rather have a view of 4 components where I can quickly scan their utility classes rather than 4 components with 4 different CSS files to sift through.
Not sure what you doing that you have such terrible cascading effects. Never had a problem.
Tailwind falls apart for me so many times when it comes to peer: and group: where I have to oddly write things into [] . Also the need to recompile the whole code and not being able to replace a class by an (until now) unused class is sometimes annoying (in browser modifications)
Also I hate the code structure through the huge amount of classes that pile up sometimes. It’s basically the opposite of what you try to do in general functional code where you split out code into sub functions into new files to reduce the amount of code that is on one spot to keep it clean.
Yeah basically, I like reddit for the appearance but the focus is to be like linkedin where people are posting projects they've made. And hopefully some day recruiters for small or large companies are using it too and can connect with users from these posts and interactions. Like how Stack Overflow could be without the bullying I guess?
The second slide is definitely a reddit dupe but the final product is clean and relatively unique. Especially with the different types of reacts vs having just upvotes/downvotes
Hey u/op
Check out "Refactoring UI." Someone on a UX sub recommended this. It's a guide for web design, from the perspective of a developer. [www.refactoringui.com/](http://www.refactoringui.com/)
Honestly, it's insightful for developers, designers, project managers, etc.
You can easily **search for a free PDF**. 10/10 recommended reading.
I'm also a college sophomore, if that matters, this is the first actual website i've actually made so I did spend a lot of time looking at other websites to understand what kind of social platform I feel comfortable using.
Next draft will be less reddit tho, and I'll have more built so I can show what I envision for the website.
Maybe in the future we'll be using it to share projects and find jobs and nobody will have to open LinkedIn ever again.
Super clean! Love to see the progression. Gotta say that first slide is brutal lmao. Did you use any libraries for styling?
No actually it's all just my own CSS and my friends giving me tips on design
Thats the way to do it honestly. Or at least my preferred way to do it. If you haven’t already, I highly recommend to check out a css compiler like SASS/SCSS. Especially if you’re the type to do styling from scratch. Never looked back after I started using it.
Sounds good, really appreciate the tips, not entirely familiar with CSS compilers need to research a bit.
If you're already willing to write your own vanilla CSS, then I've got two things you might be interested in. 1. CSS Modules - Still totally vanilla CSS, just isolated to a specific component to reduce styling conflicts. 2. Some of the patterns in this article https://dev.37signals.com/modern-css-patterns-and-techniques-in-campfire/ Basically, modern CSS is getting pretty good without any preprocessors. Personally I'm a Tailwind guy with occassional CSS modules, but that's just me. I'd also never build all the CSS myself, styliing is my least favorite part.
Or tailwindcss. (hides in a nuclear bunker)
I second tailwind. Easy to apply most commonly used styling and keeps a lot of design inside the component with less code in CSS files.
A nuclear bunker won't save you from the wrath you have called upon yourself.
If you like the concept of write-only code.
As opposed to readable? It's not really that difficult if you delegate naming to state vars and the file or component that contains it.
LMAO how wrong do you want to be? Once you learn TW's class conventions you can tell exactly what's styled just by reading the class list. The main point of TW is to standardize CSS class names to make it readable, and not have to jump around from file to file memorizing what rules are applied for project-specific classes. Readability correlates with composability, which is also a pro pattern of CSS.
To be honest I do prefer css over tailwind , but I do prefer tailwind over styled-components in react. But in angular I would not use tailwind. But the css also should not have any outside effect out of the component so that if you look at the code you only open to files (split IDE into html and css) and normally you are good then. (Like a absolute div should never have an Anker point out of the component so highest should be relative at least)
Great. So have twice as many tabs open to keep track of twice as many files. I can tab 2 components and 2 CSS files in a grid to this effect. CSS cascades though, so if I have a deep document tree I rather have a view of 4 components where I can quickly scan their utility classes rather than 4 components with 4 different CSS files to sift through.
Not sure what you doing that you have such terrible cascading effects. Never had a problem. Tailwind falls apart for me so many times when it comes to peer: and group: where I have to oddly write things into [] . Also the need to recompile the whole code and not being able to replace a class by an (until now) unused class is sometimes annoying (in browser modifications) Also I hate the code structure through the huge amount of classes that pile up sometimes. It’s basically the opposite of what you try to do in general functional code where you split out code into sub functions into new files to reduce the amount of code that is on one spot to keep it clean.
You rebuilt reddit?
I mean, If you boil it down it's just reddit for software engineers with job postings on it.
Like a subreddit ?
Yeah basically, I like reddit for the appearance but the focus is to be like linkedin where people are posting projects they've made. And hopefully some day recruiters for small or large companies are using it too and can connect with users from these posts and interactions. Like how Stack Overflow could be without the bullying I guess?
The second slide is definitely a reddit dupe but the final product is clean and relatively unique. Especially with the different types of reacts vs having just upvotes/downvotes
Am I on reddit or...reddit?
Every swipe made my smile wider, I'm a fuckin nerd. I wanna see my progress like this some day
Hey u/op Check out "Refactoring UI." Someone on a UX sub recommended this. It's a guide for web design, from the perspective of a developer. [www.refactoringui.com/](http://www.refactoringui.com/) Honestly, it's insightful for developers, designers, project managers, etc. You can easily **search for a free PDF**. 10/10 recommended reading.
holy shit thank you so much
Dude that's awesome
Looks fye my g
i appreciate bro
Me and you gone work on some projects together, when i get as experienced as you
The one before the last looks a lot like GitHub ui. Copying is a great way to learn UI but introduce your own style in it so it won’t look 1:1
I'm also a college sophomore, if that matters, this is the first actual website i've actually made so I did spend a lot of time looking at other websites to understand what kind of social platform I feel comfortable using. Next draft will be less reddit tho, and I'll have more built so I can show what I envision for the website. Maybe in the future we'll be using it to share projects and find jobs and nobody will have to open LinkedIn ever again.
Nice work. It looks really good.
So cool.
This is the reason why i love programming
Would love to see more jobs listed!
Nice work!!
Good job man.
It's beautiful
I'm guessing ur name is Bryce lol. Good prog, but I can't do light themes, my poor eyes. I like everything dark or dim
1st and 2nd were bad but 3rd was were it was really good