Hitting a wall at Data Viz & Dynamic App Projects

Hey fellow campers, I am now trying to work on the React projects, D3 projects, and the dynamic web app projects. I am finding these substantially more challenging than any before, to the point where I read the project description and have basically no idea where to even begin. I have only completed the first 2 React challenges out of all of these.

Does anyone have good recommendations on resources/tutorials to get a better grasp on these new concepts? Or just anecdotes from your own learning experience? I have worked through some tutorials already, and been reading the React docs for example, but I know from my prior experience that some explanatory material I find online is much more effective than others. So I am wondering if anyone has found any resources that really stand out to them. Or just general advice on tackling these challenges and wrapping your head around them from a conceptual standpoint.

I would like to make my learning process as efficient as possible but it is hard to know how to do this from the outset.

Thanks!

Oh, cool! So, this is interesting I have started FCC recently since this switch from Angular. I actually did not know FCC used to use Angular. Do you know anything about the reasoning behind this change? Obviously React composes a large part of the curriculum now.

I don’t know very much about Angular but from what I’ve learned about React it seems like a very different way of doing things. It’s also relatively knew.

To me, seeing FCC shift to React from Angular implies a view that React will be gaining relatively in prominence in the near future? Would you agree with this?

It would be nice for any FCC admins more knowledgeable about this topic to join in if you happen to be passing by!

I’m at the same place as you and having the same experience really. I have done the first 2 React projects. It’s taken me a while to do them partly down to feeling a bit lost and also other things. I left it for a couple of weeks and came back with a fresh mind. I’ve watched a load of videos on Youtube, read many tutorials and the like. Seems easy enough following along, I think I’ve ‘got it’ but then find it difficult to put into practice. So far I have managed by finding a resource that does something similar to what I’m looking for then adapting it to my needs.

I think some of the problem I find with React is how often it’s updated and how often the methods change and are deprecated. I find some resource that I think I can use as a base but because it’s over a year old while the principle is the same, the code is outdated. Also many people combine React with other frameworks. Because these people are obviously quite experienced coders it always seems to be ‘Build this with React… and (insert some other framework / library I don’t know)’ One new framework at a time is enough!

For the Recipe Box I think this tutorial has the basis of what is needed, although it is 18 months old

Aside from that, LevelUpTuts course on Youtube, here has some simple examples. This one really helped me with the camper leaderboard

1 Like

I started out with a Data Visualization project with ReactJS coupled with few other chart libraries out there.

While it took some time to figure out, the general idea behind it was to use React’s virtual DOM concepts to sort of making the app perform better (hopefully). Here was my overall experience -

  • The code was much easier to maintain and debug. It was very portable too - I re-used a lot of visualization components into other projects, which meant faster development.

  • It was easy enough to - the best practices recommend that components should be as stateless as possible. So I did the same - passing down configurations as props . So anybody else who uses these components wouldn’t have to worry about learning to use any chart or visualization libraries - it was all de-coupled.

  • Your components would of-course be using libraries from within, but when you import these components into your existing app, the developer ideally should only be given information on what kind of props would he need to pass.

So, your challenge while designing components will be in figuring out on the kind of props that your components accepts from the parent, studying the APIs w.r.t the chart library that your component uses underneath OR writing your own custom svg /canvas logic, and figuring out how you’re gonna use the props to render the charts.

Hopefully this makes some sense and is helpful to you? :smiley: And feel free to check out my project here - https://github.com/booleanhunter/ReactJS-AdminLTE

Thanks for the reply! That project looks really good btw.

I seriously cannot recommend this course enough. I personally found a lot of the Youtube videos to be rushed and confusing. Of course even after this course I still feel lost at times but it helped me understand a lot of the best practices for using React.

3 Likes

I worked through that course Tyler made about a week ago and I was blown away! I agree, truly incredible resource, definitely the best I’ve found.

Thanks so much for recommending tyler’s course. I am so glad I am starting to learn React through his course or else I would have wasted weeks trying to get a basic understanding of React.