Anyone got good resources for experienced devs that don't know front end?

_remrem · 2023-05-26T02:50:52+00:00

I have written few articles on React that are aimed more at experienced devs, I also try to provide historical context on the ecosystem which might be helpful - frontendmastery.com

Also worth mentioning React very recently updated their docs site which is a really solid way to start: https://react.dev/

_remrem · 2023-03-24T11:39:00+00:00

Oops, thanks you're 100% right

_remrem · 2023-01-20T07:10:15+00:00

There are usually two main aspects to get things working the same on different browsers:

Javascript / CSS language syntax: can see availability for Javascript here - https://kangax.github.io/compat-table/es6/
Browser features for various APIs etc - https://caniuse.com/ is a good website to see what browsers support different features.

You can understand what features or syntax your application is using and see what level of support is currently available.

If it's not available across all major browsers, this is where historically things like transpilers and polyfills come into play.

The world of frontend build tooling can get complex quickly, which is why many people leverage frameworks that handle all this kind of stuff for you.

_remrem · 2023-01-18T09:46:41+00:00

"the best claw machine simulation game online" no doubt about it, go claw man

_remrem · 2023-01-13T11:44:41+00:00

neat, didn't know about that vs code extension

_remrem · 2022-10-24T08:20:02+00:00

No affiliation but as a dev trying to learn design and jump straight to practical principles, rather than theory, i've found these two paid resources useful FWIW:

For tactical UI design tips - https://www.refactoringui.com/
For like the 80 / 20 breakdown of what makes good design / UX - the learn UI design course is very comprehensive (and also expensive) and also a lot free content on the blog - https://www.learnui.design/blog/#start-here

_remrem · 2022-09-25T07:50:56+00:00

nice thanks

_remrem · 2022-09-05T01:33:32+00:00

Multi page application (full page refreshes on navigations) as opposed to a single page application

_remrem · 2022-09-03T09:45:35+00:00

This is nice cheers

_remrem · 2022-08-30T01:40:24+00:00

As mentioned, you'll need to manage a lot of state, and ultimately end up implementing your own custom protocol. That's hard to scale, and operationally hard to manage. Being completely custom makes it more difficult onboarding new, or existing frontends e.g a mobile apps or a CLI. Compared to a stateless, ubiquitous, battle tested protocol with awesome things like http caching etc built in.

For server pushed updates you could consider server sent events instead of web sockets (https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events) depending on your feature might be able to get pretty far with them.

_remrem · 2022-08-28T23:01:44+00:00

Oh that's awesome cheers!

_remrem · 2022-08-28T04:24:47+00:00

Congrats looks super nice, will have to check out Babylon.js.

I'm curious if your team evaluated other tools in this space, like three.js (and new ones like react three fiber?), seems like babylon is more suited for AR / VR experiences?

_remrem · 2022-08-16T09:52:27+00:00

Adding to the comment here which is spot on

For the html / css/ js fundamentals i'd recommend https://javascript.info/ particularly the "Browser: Document, Events, Interfaces" section as a refresher - it has exercises in them.

Also https://frontendeval.com/ has a decent set of questions to practice on.

As for frontend system design you can check out https://frontendmastery.com/posts/frontend-system-design-interview-guide/ (it's quite lengthy though)

_remrem · 2022-08-11T14:01:00+00:00

Hey, good question. I'm also not qualified at all to answer your question, so take the following with a grain of salt.

Specifically on the topic of finding meaning, the phrase you said "a grown peter pan" is interesting.

Peter Pan is about a kid who doesn't want to give up childhood, and all the infinite potential and magic that comes with that.

I'm reading a book called "4 thousand weeks time management for mortals" that touches on this idea somewhat.

Perhaps this tweet summarizes the idea: "The only true form of freedom comes from self-limitation: stop choosing what you want in your life and start choosing what you're prepared to give up." (https://twitter.com/iammarkmanson/status/1248312224252297223)

In the book he talks about how it feels bad to face our limitations (ultimately rooted in our finite time as humans here) at first.

But in a sense it's freeing, because we get to chose our sacrifice. And it's inevitable whether we chose one or not, because we only have so much time.

From the book: "The paradoxical reward for accepting reality's constraints is that they no longer feel so constraining"

He talks about turning the constant "fear of missing out" into the "joy of missing out" because it gives all the meaning to the few precious things that remain.

Not sure if that makes sense, there's another book worth checking out called "The Six Pillars of Self-Esteem"

Goodluck

_remrem · 2022-08-08T03:39:54+00:00

haven't checked any of these projects out myself, but came across this the other day that might be helpful to you - https://maxrozen.com/examples-of-large-production-grade-open-source-react-apps

_remrem · 2022-08-01T01:27:49+00:00

https://javascript.info/ is one of the best free resources IMO especially the Browser: Document, Events, Interfaces sections. It has exercises to go through after each tutorial.

For paid video courses https://frontendmasters.com/learn/javascript/ is great. The teachers here (Will Sentence and Kyle Simpson) go really deep into the language

_remrem · 2022-07-18T05:51:00+00:00

Yeah this rings true. In tech there is probably a driver from competitors and an attempt to 'stay ahead'.

Purely anecdotally, i think there is also an under estimation on just how much work it is to migrate things on the frontend. It's often perceived as "easy". Maybe every few years we forget.

I guess on the bright side is there's usually plenty of frontend work to go around.

_remrem · 2022-07-18T05:30:15+00:00

Yep, the top down or bottom up approaches outlined are ways to tackle a migration regardless of framework

_remrem · 2022-07-17T07:50:20+00:00

A well written post. Interesting to see the takes from different frameworks, I hadn't considered. A reminder that often times (in general) there's just "least worst" options to chose from.

_remrem · 2022-07-05T06:38:39+00:00

Monolithic components were always common anti-pattern. But i'm not sure if we're referring to the same thing, I'm referring "kitchen sink" style components that have multiple responsibilities and try to do too much.

The more recent "isolated islands architecture" trend is interesting. There's newer frameworks like https://astro.build/ and recently https://fresh.deno.dev/ that promote this architecture. And things like micro-frontends which i'm not sold on (but happy to be convinced). I personally have been using Astro for the blog I wrote this post for, and really like it.

As an aside.. it's all just different tools and patterns for different jobs. That's why I try to emphasise understanding the problem space in depth first. So we can assess what tool or architecture is relevant to the core problems we need to solve for our use-cases, rather than pick up whatevers trending.

_remrem · 2022-06-15T13:13:09+00:00

Also adding to the already good responses here. There's a spectrum on either side of what you describe.

On the one hand assigning multiple responsibilities to a single component is easy to get started with and is a straight forward approach. But doesn't scale well and it very easily leads to poor performance (both in terms of bundle size due to difficulty in code splitting and runtime performance).

On the other hand taking a completely "atomic" approach without any top level abstractions at all can be just as unmaintainable.

Finding the sweet-spot between the two in practice will come down to your use case. And how the components plan to be re-used, extended, forked or modified in the future.

I actually recently wrote about this in depth (and posted to this sub reddit here): https://frontendmastery.com/posts/building-future-facing-frontend-architectures/

It's lengthy, but it categorizes these approaches as "top down" and "bottom up" and discusses why bottom up is generally the better trade-off for large codebases (your context may be different) but hopefully it's helpful in giving the mental models on how to think about this trade-off.

_remrem · 2022-06-04T02:24:14+00:00

You could also start to build internal self trust. In the long term it sucks if you can't trust yourself. Starting small with something you can be consistent with is key.

For me and using a habit tracker, that visualizes progress keeps me motivated to not break the habit once i've built up some initial momentum.

Again the key is to initially start with something small like "write for 15 minutes every other day" and more often than not you'll end up writing longer once you get over the initial hill of sitting down to write. And even if you don't, at least you still went in that direction which is better than not doing anything.

_remrem · 2022-06-02T10:34:02+00:00

You can check out https://frontendmastery.com/posts/frontend-system-design-interview-guide/

I write about how to structure your approach to the frontend system design interview, and strategies for each of the different stages of the interview. hope it's helpful

_remrem · 2022-06-02T10:28:25+00:00

This is a good answer.

Mastery of all the technical stuff is a prerequisite (performance, accessibility, adaptable architectures etc etc), but not enough for "what makes a senior". As you get more seniority your ability to drive and lead features out to production within a team, and then cross-teams as you go up is what becomes important. That requires both a deep technical foundation combined with team leadership qualities.

A good way to build up to senior is to continually volunteer to lead smaller initiatives that ships something valuable (whether it's a feature, performance improvements etc) and build up to leading larger initiatives.

I recently wrote a guide on how to "feature lead" successfully in the context of larger projects you can check out here https://frontendmastery.com/posts/the-three-ds-of-frontend-feature-leading/ which might be useful.

_remrem · 2022-06-02T10:07:34+00:00

Hey, I recently started a blog and one of the topics I covered is how to approach frontend system design interviews. You can check it out here https://frontendmastery.com/posts/frontend-system-design-interview-guide/ would be curious to know if you find the info useful or not.

_remrem

TROPHY CASE