search

NowYouKnowProgramming / webdev-learning-materials

Don't waste time - the highest quality resource hub for web developers (and not only!)
https://bewebdev.tech
BSD 3-Clause "New" or "Revised" License
58 stars 11 forks source link

React materials #33

Closed Willaiem closed 1 year ago

Willaiem commented 1 year ago

This issue will contain the materials, which will be added to the existing React section.

Willaiem commented 1 year ago

(all needs to be verified)

https://www.youtube.com/watch?v=UXDAp0ILOwg - already added https://medium.com/.../intro-to-debugging-reactjs... - already added https://www.youtube.com/watch?v=_rnxOD9NKAs - I would avoid this channel as well. This video is definitely too long and explained quite badly. https://www.digitalocean.com/.../how-to-debug-react... - it's fine. this can be added.

Willaiem commented 1 year ago

Podstawy React-Spring: https://www.youtube.com/watch?v=AR5Zbw2u_Ug - not a fan of this tutorial https://www.youtube.com/watch?v=kT6yYSwK1oA - cool tutorial, this can be added to a new section called "animations" Podstawy Framer Motion: https://www.youtube.com/watch?v=2F76YujtChs https://www.youtube.com/playlist?list=PLLnpHn493BHElflAIAcieF8toJ_ja9vjX - replaced with the playlist, this seems good. This can be added. https://www.youtube.com/watch?v=YxLMAk2H3ns - more like a tutorial, on how to make page transitions. Still, an interesting one to add to the docs. Porównanie React-Spring i Framer Motion: https://ichi.pro/.../react-spring-vs-framer-motion... - this seems translated by Google Translate and it's awful. Przykładowe projekty z tymi bibliotekami: https://www.youtube.com/watch?v=SuqU904ZHA4 - decent tutorial, this can be added. https://blog.logrocket.com/animations-with-react-spring/ - this looks interesting, this can be added to a new section called "animations"

Willaiem commented 1 year ago

Materiały dotyczące zwiększenia wydajności aplikacji:

Willaiem commented 1 year ago

Materiały:

Willaiem commented 1 year ago

Przykłady użycia memoizacji w React:

Willaiem commented 1 year ago

DRY in React apps: https://javascript.plainenglish.io/5-dry-principles-to... - there are some antipatterns that we want to avoid SOLID in React apps: https://medium.com/.../s-o-l-i-d-principles-with-react... - not a fan of this article https://blog.usejournal.com/how-to-apply-solid-principles... - outdated

Lukortech commented 1 year ago

Is there a way to provide any help here? Would you want to have someone to look at the resources and put them in place or just check if they are up-to-date?

Willaiem commented 1 year ago

Is there a way to provide any help here? Would you want to have someone to look at the resources and put them in place or just check if they are up-to-date?

I want to check them out if they're worth putting into the repo.

goodideagiver commented 1 year ago

(all needs to be verified)

https://www.youtube.com/watch?v=UXDAp0ILOwg https://medium.com/.../intro-to-debugging-reactjs... https://www.youtube.com/watch?v=_rnxOD9NKAs https://www.digitalocean.com/.../how-to-debug-react...

Potrzebny opis co znajduje się w tych linkach

Willaiem commented 1 year ago

https://javascript.plainenglish.io/tips-for-writing-better-react-code-ceb49e929001 verified by @goodideagiver

Willaiem commented 1 year ago

Traversy Media - 5 Pro-Level React Do's & Don'ts with Jack Herrington https://www.youtube.com/watch?v=4FhJkX18fS8 - pretty good video, this can be added to the "Principles for React" section

Jack Herrington - UseState: Asynchronous or what? https://www.youtube.com/watch?v=RAJD4KpX8LA - pretty good video, this can be added to the "Principles for React" section

(verified)

goodideagiver commented 1 year ago

Verified

What is use memo and use callback - dev.to added

Use memo

https://youtu.be/THL1OPn72vo added

Use callback

https://youtu.be/_AyFP5s69N4 added

goodideagiver commented 1 year ago

Materials to find:

How react hooks and react work under the hood

goodideagiver commented 1 year ago

Beta react docs: https://beta.reactjs.org/ added

goodideagiver commented 1 year ago

https://usehooks.com/ @Willaiem verified? added

Willaiem commented 1 year ago

https://usehooks.com/ @Willaiem verified?

Yes, you can add it.

Willaiem commented 1 year ago

need to find a good free react video tutorial

Willaiem commented 1 year ago

Użycie three.js w React wraz z biblioteką react-three-fiber https://www.youtube.com/watch?v=fdtqqyeKRJk https://www.youtube.com/watch?v=Qs9A3XIjbg4 the library had some breaking changes, this video shows the deprecated way.

Willaiem commented 1 year ago

(verified) PedroTech - Animations In React - Framer-Motion Tutorial - https://www.youtube.com/watch?v=GOuwOI-WSkE

Willaiem commented 1 year ago

Beta react docs: https://beta.reactjs.org/

already added

goodideagiver commented 1 year ago

https://github.com/NowYouKnowProgramming/webdev-learning-materials/issues/33#issuecomment-1276867725

added

Willaiem commented 1 year ago

Michał Taszycki - Legacy React - czyli jak zrobić refactoring i nie stracić pracy! - https://www.youtube.com/watch?v=92fvMwBrHGA - this is decent lecture, can be added.

Willaiem commented 1 year ago

All the verified materials are added. Soon, the branch with the newly added materials will be merged.

goodideagiver commented 1 year ago

@Willaiem all added in #126 ?

Willaiem commented 1 year ago

Yes, let's close this issue.