Developers October 19, 2020

I'm trying to become a React JS pro, any tips? 🤔

Josh Ternyak @JoshTernyak

I'm currently very experienced and good at CSS.

And I know how to make basic components in React JS. I want to build an app like indiehackers by myself, but I'm not knowledgeable enough (yet) to build a basic Indiehackers replica by myself.

I would love to get any tips on which courses to watch and code along with, or which blogs to read to get me closer to being able to build an Indiehackers replica.

  1. 8

    Hey Josh, I talked to you earlier about this. Here's a some tips that are a bit more in depth.

    Learn the fundamentals using React's official docs. Once you learn basic syntax, imports, components (functional and class), and React Hooks, then start making your first project. Here's a good list of ideas:

    • Todo list (pretty much any beginner learning React should make this. It is fundamental.)
    • Some type of info card. Then loop them and add your own JSON data to practice components.
    • CRM tool
    • Make an app involving the Fetch API (could be a Giphy search or meme search)

    There are more here

    Once you're happy with how one of them turned out, open-source it on Github and add it to your portfolio website! This will help you gain publicity. I did the same with React-Emoji-Search and React-Tailwind-Portfolio. It did wonders for my Github page and I learned so much.

    Once you have done this, try to use a CSS framework. I suggest Tailwind for utility-first design and Ant.design for a component library. But ya know... everyone's different :P

    Someone on Hackernoon made a great Roadmap for steps after what I just went through. Check it out here: https://hackernoon.com/the-2020-reactjs-developer-roadmap-8q143yan

    Hope this helps, Josh. Wish you the best!

    1. 2

      Thanks Brayden. I really appreciate the help!

  2. 3

    For building just the front-end? I'd say, pick a UI framework you'd like to learn (Tailwind, Material-UI, etc) and learn from the documentation for it. And find a tutorial for React Hooks if you haven't learned it already. I'd recommend Traversy Media's tutorial but there's plenty of others: https://www.youtube.com/watch?v=mxK8b99iJTg

    For building the full stack for something like IndieHackers? Including authentication, commenting & voting, etc? It's a much more involved process and probably requires you have some coding background already, but I'm currently following Ben Awad's ~14 hour tutorial and it's going well so far: https://www.youtube.com/watch?v=I6ypD7qv3Z8

    He walks you through building a Reddit clone step-by-step.

    1. 1

      Great advice Guamhat. Love the piece about learning with a UI framework 👍👍

    2. 1

      Hey, thanks for the advice. I'll definitely look into similar courses.

  3. 2

    One piece of advice is not to get bogged down in Redux. Most tutorials jump right into redux when it frequently isn’t necessary and is frustrating to learn unless you have a very specific need for it. Try building whatever you are building without it. Only add it in if you can’t figure out any other way to manage state :)

    1. 1

      Thanks, that's great advice.

  4. 2

    A good skill to have is stepping back and figuring out what you need to learn to be effective.

    If I’m learning a new framework some questions I think about:

    • how is state managed in this framework?
    • what was the reason the author(s) made this framework? What problem does it aim to solve?
    • is there a high quality repo I can download, run, and change, in order to figure out best practices, etc?
    • what are some of the auxiliary packages/libraries that are often used with this framework and why?

    —-

    For building something like IH you could basically break the problem down into easier steps.

    So first thing you need is the ability to post a question.

    Can you make an input box that “saves” the data somewhere when you post a question? (you can even do this in memory right now before adding the db, if you’d like to keep it simple)

    Can you figure out how to make a route that a user can navigate to based on the posted question?

    How do you add comments?

    Etc.

    You got this! Programming is all about problem solving and breaking things down into simpler problems.

    1. 2

      Hey Kenneth, that's very helpful. Thanks a lot.

  5. 1

    Hey @JoshTernyak I just published the first issue of my newsletter with React at its core focus. Its for beginners and aims to take baby-steps into the world of React with bite-sized tutorials. I've been developing things with React for over 4 years now and want to solidify my knowledge by teaching others. See if this could be useful to you - https://jatinsandilya.substack.com/

  6. 1

    Something that I don't have personal experience with, but heard some good recommendations on Twitter for https://EpicReact.dev from Kent C Dodds. I am still contemplating joining it :)

  7. 1

    https://epicreact.dev/ - ” This self-paced workshop collection will start from the very beginning of the React journey and guide you all the way through well-tested application architecture.”

  8. 1

    Hi Josh, I am also trying to learn React. Why not learn together?

    1. 1

      Hey! You might enjoy React Tutorial then :D

  9. 1

    in order of importance

    1. learn dev tools. jest,eslint,webpack,babel etc.
    2. learn react ecosystem. its big.
    3. anythign else
  10. 1

    Start from reading their own documentation and tutorials https://reactjs.org/tutorial/tutorial.html , then make rough design of the wepp app and start coding!

    You will be becoming pro ONLY through the experience, no any watching videos, whatever expensive they are.

    Note. Before you dig into React, make sure you are pretty pro in JavaScript.

  11. 1

    Just started https://rephrased.substack.com/

    Weekly JavaScript challenges to help you become a guru.

    Were going to have a heavy focus on React in the coming weeks.

    1. 2

      That sounds very interesting! Just joined.

    2. 1

      Very cool! Just subbed :D

      1. 1

        Great news! Would love to hear how you get on with the first challenge.

Recommended Posts