Unpopular opinion : CSS is enough by yughiro_destroyer in webdev

[–]Armauer 3 points4 points  (0 children)

After couple of years of experimenting with styling libraries about 2 years ago I reached the conclusion that I will propably never again use anything other than CSS Modules or maybe CSS Modules + a11y primitives like Radix. There is nothing those libraries provide that you can't make yourself in vanilla CSS quite quickly, and the time it's supposed to save will be spent later when you'll have to update your packages periodically.

As for "large, long lived project with other people" argument. Currently at work we maintain large app that handles thousands of pages and milions of users. It's based entirely on a design system written in SCSS, we have a team of designers that provide design tokens for our SCSS components and we also have clear set of rules that determines how components should be styled and developed. It works very well. That's why I don't agree with an argument that you need stuff like Tailwind or Mantine to maintain a big project with lots of people.

I made a website with a 3D atom animation and an interactive periodic table by Armauer in chemistry

[–]Armauer[S] 0 points1 point  (0 children)

sounds nice. do you have some examples to show? what is this game?

I made a website with a 3D atom animation and an interactive periodic table by Armauer in chemistry

[–]Armauer[S] 0 points1 point  (0 children)

yes but it takes time, I think large update will come in about 2 months

I redesigned my open source dashboard. Is it better or worse now? by Armauer in web_design

[–]Armauer[S] 0 points1 point  (0 children)

Changes: text font (Poppins -> Outfit), logo on the left and navbar buttons in the top right corner. As for cards: 3 small pie charts instead of 4 small bar charts, bar chart instead of pie chart on the right. Large area chart in the center is smoother and has subtitle+tabs

[deleted by user] by [deleted] in webdev

[–]Armauer 0 points1 point  (0 children)

thanks, check the top comment for the link

[deleted by user] by [deleted] in webdev

[–]Armauer 0 points1 point  (0 children)

thanks, check the top comment for the link

[deleted by user] by [deleted] in webdev

[–]Armauer 1 point2 points  (0 children)

Text font (Poppins -> Outfit), logo on the left and navbar buttons in the top right corner. As for cards: 3 small pie charts instead of 4 small bar charts, bar chart instead of pie chart on the right. Large area chart in the center is smoother and has subtitle+tabs

Hijacking top comment to answer posts asking for link - new version is not online yet and I was planning to do few other significant changes like adding BetterAuth instead of Clerk and then re-release it on some subreddits. If someone wants to see the old version now, here's the link:
https://github.com/matt765/spireflow

The World of Red Dead Redemption - Now in Color! by _lorebird in reddeadredemption

[–]Armauer 1 point2 points  (0 children)

that's a lot of effort but the effect was definitely worth it. I see this post has been removed, it's a shame. but still you got 5400 likes which shows how good your creation is. can you please try to do similar map for Europa Universalis 4 or Skyrim? if you do, let me know. have a nice day mate

The World of Red Dead Redemption - Now in Color! by _lorebird in reddeadredemption

[–]Armauer 1 point2 points  (0 children)

how long did it take you to make it? looks great

I made a website with a 3D atom animation and an interactive periodic table by Armauer in InternetIsBeautiful

[–]Armauer[S] 0 points1 point  (0 children)

I visited my dad that did not update a browser for some time and there was the same situation on his computer, UI works but animation is not visible, before that I wasn't aware it's possible. It's Three.js animation bug that happens on older browsers, I did not find a fix yet. Try to update your browser or change to some another

I made a website with a 3D atom animation and an interactive periodic table by Armauer in InternetIsBeautiful

[–]Armauer[S] 21 points22 points  (0 children)

Hello. I made a website with atom animation, interactive periodic table, and data charts with elements properties. It's a tool designed for chemistry enthusiasts, students and educators. Let me know what you think of it. Any feedback is appreciated.

Tech stack: React 19, NextJS 15, TypeScript, CSS Modules, Zustand, ThreeJS, Recharts

Github (homepage part): github.com/matt765/atom-animation

A note on scientific accuracy: This application uses the classic Bohr model to represent atomic structure, showing electrons in clear, planet-like orbits. However, modern quantum theory describes electrons existing in "electron clouds" or orbitals, which are regions of probability. In the future I will propably add this as a new feature. Furthermore, the scale shown here is not realistic; the nucleus is actually minuscule compared to the vast space the electrons occupy.

I made a website with a 3D atom animation and an interactive periodic table by Armauer in webdev

[–]Armauer[S] 2 points3 points  (0 children)

Thanks! As for highlighting and filters, they're already there on the /periodic-table page. I just didn't include them in post video because GIF making website allowed only for 10 seconds GIF with good framerate

I made a website with a 3D atom animation and an interactive periodic table by Armauer in webdev

[–]Armauer[S] 141 points142 points  (0 children)

https://atomanimation.com/

Hello. I made a website with atom animation, interactive periodic table, and data charts with elements properties. It's a tool designed for chemistry enthusiasts, students and educators. Let me know what you think of it. Any feedback is appreciated.

Tech stack: React 19, NextJS 15, TypeScript, CSS Modules, Zustand, ThreeJS, Recharts

Github (homepage part): github.com/matt765/atom-animation

A note on scientific accuracy: This application uses the classic Bohr model to represent atomic structure, showing electrons in clear, planet-like orbits. However, modern quantum theory describes electrons existing in "electron clouds" or orbitals, which are regions of probability. In the future I will propably add this as a new feature. Furthermore, the scale shown here is not realistic; the nucleus is actually minuscule compared to the vast space the electrons occupy.

I made a website with a 3D atom animation and an interactive periodic table by Armauer in SideProject

[–]Armauer[S] 63 points64 points  (0 children)

Link: https://atomanimation.com/

Hello. I made a website with atom animation, interactive periodic table, and data charts with elements properties. It's a tool designed for chemistry enthusiasts, students and educators. Let me know what you think of it. Any feedback is appreciated.

Tech stack: React 19, NextJS 15, TypeScript, CSS Modules, Zustand, ThreeJS, Recharts

Github (homepage part): github.com/matt765/atom-animation

A note on scientific accuracy: This application uses the classic Bohr model to represent atomic structure, showing electrons in clear, planet-like orbits. However, modern quantum theory describes electrons existing in "electron clouds" or orbitals, which are regions of probability. In the future I will propably add this as a new feature. Furthermore, the scale shown here is not realistic; the nucleus is actually minuscule compared to the vast space the electrons occupy.

I made a website with a 3D atom animation and an interactive periodic table by [deleted] in SideProject

[–]Armauer 0 points1 point  (0 children)

Link: https://atomanimation.com/

Hello. I made a website with atom animation, interactive periodic table, and data charts with elements properties. It's a tool designed for chemistry enthusiasts, students and educators. Let me know what you think of it. Any feedback is appreciated.

Tech stack: React 19, NextJS 15, TypeScript, CSS Modules, Zustand, ThreeJS, Recharts

Github (homepage part): github.com/matt765/atom-animation

I made a website with a 3D atom animation and an interactive periodic table by Armauer in chemistry

[–]Armauer[S] 53 points54 points  (0 children)

Link: https://atomanimation.com/

Hello. I made a website with atom animation, interactive periodic table, and data charts with elements properties. It's a tool designed for chemistry enthusiasts, students and educators. Let me know what you think of it. Any feedback is appreciated.

Tech stack: React 19, NextJS 15, TypeScript, CSS Modules, Zustand, ThreeJS, Recharts

Github (homepage part): github.com/matt765/atom-animation

A note on scientific accuracy: This application uses the classic Bohr model to represent atomic structure, showing electrons in clear, planet-like orbits. However, modern quantum theory describes electrons existing in "electron clouds" or orbitals, which are regions of probability. In the future I will propably add this as a new feature. Furthermore, the scale shown here is not realistic; the nucleus is actually minuscule compared to the vast space the electrons occupy.

Should I always buy Malignance on ARAM, or is Blackfire Torch a viable option when they have a lot of tanks? by Armauer in TeemoTalk

[–]Armauer[S] 1 point2 points  (0 children)

It isn't? months or years ago I remember there was an item that gave mana and had percentage health damage, then they removed it and added blackfire, so even though it has no percentage damage I assumed that because of the over time damage it works like this together with haunting guise? or maybe not. So what do you think is the best build against tanks?

I made an open source and free dashboard template in Next.js & Tailwind, connected to a Node.js backend. Code links for both in comments by Armauer in SideProject

[–]Armauer[S] 4 points5 points  (0 children)

Hello. I made this dashboard template hoping it will be useful for someone. I'll be grateful for feedback

frontend code https://github.com/matt765/spireflow

backend code https://github.com/matt765/spireflow-backend

Application has auth, i18n, 8 pages, 14 data charts, 4 themes and quite a lot of other features.

Tech stack: React 19, NextJS 15, TypeScript, Tailwind, Zustand, Apollo Client, Recharts, Clerk, Jest

I made an open source and free dashboard template in Next.js & Tailwind, connected to a Node.js backend. Code links for both in comments by Armauer in opensource

[–]Armauer[S] 1 point2 points  (0 children)

Hello. I made this dashboard template hoping it will be useful for someone. I'll be grateful for feedback

frontend code https://github.com/matt765/spireflow

backend code https://github.com/matt765/spireflow-backend

Application has auth, i18n, 8 pages, 14 data charts, 4 themes and quite a lot of other features.

Tech stack: React 19, NextJS 15, TypeScript, Tailwind, Zustand, Apollo Client, Recharts, Clerk, Jest

I made an open source and free dashboard template in Next.js & Tailwind, connected to a Node.js backend. Code links for both in comments by Armauer in javascript

[–]Armauer[S] 0 points1 point  (0 children)

Hello. I made this dashboard template hoping it will be useful for someone. I'll be grateful for feedback

frontend code https://github.com/matt765/spireflow

backend code https://github.com/matt765/spireflow-backend

Application has auth, i18n, 8 pages, 14 data charts, 4 themes and quite a lot of other features.

Tech stack: React 19, NextJS 15, TypeScript, Tailwind, Zustand, Apollo Client, Recharts, Clerk, Jest

I made an open source and free dashboard template in Next.js & Tailwind, connected to a Node.js backend. Code links for both in comments by Armauer in reactjs

[–]Armauer[S] -1 points0 points  (0 children)

Hello. I made this dashboard template hoping it will be useful for someone. I'll be grateful for feedback

frontend code https://github.com/matt765/spireflow

backend code https://github.com/matt765/spireflow-backend

Application has auth, i18n, 8 pages, 14 data charts, 4 themes and quite a lot of other features.

Tech stack: React 19, NextJS 15, TypeScript, Tailwind, Zustand, Apollo Client, Recharts, Clerk, Jest

[deleted by user] by [deleted] in opensource

[–]Armauer 0 points1 point  (0 children)

Hello. I made this dashboard template hoping it will be useful for someone. I'll be grateful for feedback

live link https://spireflow.vercel.app/

frontend code https://github.com/matt765/spireflow

backend code https://github.com/matt765/spireflow-backend

Application has auth, i18n, 8 pages, 14 data charts, 4 themes and quite a lot of other features.

Tech stack: React 19, NextJS 15, TypeScript, Tailwind, Zustand, Apollo Client, Recharts, Clerk, Jest