#uiux

A really cool visualisation of the notable people's birth places around the globe done with mapbox by Topi Tjukanov

https://tjukanovt.github.io/notable-people

#tools

I've finally might have found a decent rich text editor for react - megadraft 🔥.

Needed something a bit more modern for React that is also quite extensible (eg allows files D&D and markup). Also mimicking something like telegraph (doesn't have to be that cool, but still)

Stopped at https://github.com/globocom/megadraft that is based on you guessed it Draft.js

🤓Live demo - https://megadraft.io/#/

Also do share you preferred rich text editors you've used or using right now! I've looked through too many but might have skipped something nice and obvious

#uiux #thoughts

This is the exact part I've tried to avoid in rich text editor. Somehow it always felt way too cluttered to me.

I know that's kind of a standard (probably reinforced by Microsoft back in 90s), but c'mon - this has to go away eventually.

#tools

https://www.windows93.net

This is fun. And they have Half Life 3.

#uiux

Just imagine the dedication to make that remote in HTML & CSS.

https://codepen.io/alvaromontoro/pen/xxWMPEe

#news #uiux

VS recently got updated and "continued working on the" 3-way merge editor that you can see on the screenshot. Who knows how, but it got enabled in my vscode automatically.

without further ado:

- VS Settings
- Git: Merge Editor
- Untick
- Go on with your life

https://code.visualstudio.com/updates/v1_69#_3-way-merge-editor

Everyone has Javascript, right?

A website showing all the posible cases where users will not experience your SPA that needs JS

#uiux

Just found this nice little UX example when signing up for something and it gives you links to popular email client out of the box (I generally use web versions, so found it pretty cool)

#learn #uiux

Typogrpahy

In fact, the previous UX example was from www.learnui.design where they have cool interactive tutorial on typography.

Here is a link if you want to play with it. Takes about 5-10 minutes.

Link: https://www.learnui.design/tools/typography-tutorial.html#

Don't know about you, but typography was always quite a tricky part for me. Like it always felt super "intuitive" eg Roboto/Lato is good, Comic Sans - is a joke, secondary text should just have 80% opacity instead of playing with weight etc.

But properly defining science behind it wasn't always easy. Some things are straightforward and you can get decent typography system into your app by just playing with opacity, line height and some fonts to build proper hierarchy.

Either way, if you ever felt like me that quick tutorial is a great way to kickstart your typography mastery.

#thoughts

We vs I

I see a lot of small channels on telegram using typical corporate invention and say "We" anytime they share something.

"Today we prepared for you.."
"We were quite busy lately"
"We found this cool tool.."

You get the idea.

It's totally understandable to have that in some work environments (especially where teamwork is valued more than individual achievements).

But when it comes to your personal projects, blogs, channels, personal websites etc not only I find it weird, but also damaging.

People do that to create a mental protection and share responsibility if something goes wrong (eg they've made a mistake or were completely wrong in what they shared).

Also it makes it sound like the statement is more valid (which is just a bandwagon fallacy).

The only problem is that if you are on your own there is noone to share that responsibility with, pretending that you have a team of 20 people behind you is useless as this would just bump up expectations that you ll likely won't meet.

There is absolutely nothing wrong in saying "I" like in examples above, especially if you doing something on your own. In fact, despite corporate bullshit it makes things more personal, cosy and simple, helping to set the right expectations with the crowd.

Rule of thumb unless you are in corporate ecosystem.

Was it just you involved in it?
Yes - use "I"
No - use "We"

Keep things simple in a not so simple world 🫡

Why We're Breaking Up with CSS-in-JS - DEV Community 👩‍💻👨‍💻
https://dev.to/srmagura/why-were-breaking-up-wiht-css-in-js-4g9b

#uiux

Just found Planby - a cool React component for building timelines like on the screenshot.

This can be pretty powerful lifehack when implementing calendar-like functionality. I had a pleasure of implementing something similar myself and the critical part there is rendering performance, especially when dealing with huge datasets.

My personal learning was pagination / data limitation is the key. In grid data visualisations you ll most likely end up using either infinite scrolling (both vertical and horizontal) or filtering (aka show only this week's worth of data etc).

Or both 😂

Either way, wish I had that lib to play around first before I did everything myself.

PS accessed it on mobile and was pretty smooth also

​​#uiux

Refine

A 100% open-source, headless React framework (5.2K Stars on GitHub) for CRUD apps, so you can quickly build admin panels and dashboards while still remaining flexible.✨ 

Refine seamlessly works with any custom design or UI framework you favor. For convenience, it ships with ready-made integrations for Ant Design System, Material UI, Mantine, and Chakra UI 🚀

#tools

Another one for your Swiss toolset in addition to Planby.

www.tremor.so - fairly new UI lib for dashboards, charts and graphs.

Looks pretty neat, only wish they keep it "dashboard-focused" and push into that direction.

PS as a bonus on charts you get smooth mounting animation, which some of the other chart libs don't offer out of the box.

#thoughts

www.layoffs.fyi - someone created a trackable, filterable layoff tracker since Covid 19.

Maybe can be an interesting find when you thinking which companies to send your resumes to.

#learn

Tech debt

Something we all sooner or later have to deal with.

In my experience it usually came down to either "rushing" features and deviating business model from what it was initially designed to do or complexities in "billing refactors" - some clients are difficult in understanding what's the point.

Here I'm treating "rushing" inclusive of not doing anything, packages and tools getting outdated, deprecated etc based on the logic that if you were not rushing other things, you could properly address the refactors.

Whereas the last point is fairly easy to resolve, just requires time and right arguments, the first one can bite in the future if left untouched.

And personally I think its more about building the right mentality in a team. The concept thats highlighted in "Clean Code" by Robert C. Martin - if every developer when touching the part of the system leaves it in just slightly better shape than it was, we ll end up in constantly improving, almost self-refactoring system.

Extending a feature? Maybe there is a way to improve type safety in the same file, maybe naming variable can be better, maybe function could have been splitted more logically, maybe you can rewrite something in a more concise syntax? - simple things like that, makes a difference in long term.

Interesting article on that:
🔗 Link
🕶️ 8 min

#uiux #games

If you played GTA before (wait.. Who didn't?)

Someone just added their radios to a Web in a similar UI, should work on any device, in case you want to bring some nostalgy to you coding sessions.

https://play.smolyakov.dev

PS it's in Russian, but you ll figure it out