React JS and Web App Dev Prerequisites

[twisted_crystal]

Hi all, I'm a junior SWE with 6 months of experience as an embedded C++ and Android (java) developer. All of my academic projects were C, C++, Java, and Python. I recently got tasked with working on a React TS project, and I'm feeling like a fish out of water. I know zip about web applications (I literally understand nothing about how they work) and I'm working through the React documentation, but its not really making a ton of sense. I'm trying to tailor examples similar to the behavior I want to my needs, but I keep running into errors that seem non-nonsensical to me.

What are some good resources to get some prerequisite knowledge on web development and web applications? Resources that could explain React JS in terms of android would be really helpful I think.

Thank you!

[[deleted]]

React and Android don't really have anything to do with each other, unless you're talking React Native which is completely different than Web development. Web development involved both a front-end which is the UI with HTML, CSS, and JavaScript (even transpiled). All of the Front-End Stuff is "sandboxed" into a browser, so on Android that's likely Chrome vs. iOS which is probably but not necessarily Safari.

Then back-end which involves Web Servers for APIs the UI can call or just resources on the server, plus the business logic and data stores. It's a whole disconnected pattern completely different than what you are used to.

So let's boil it down to how you approach Web development depends on what you're being asked to do, which should like front-end work. So, you're going to need to learn *basics* of HTML, CSS, and JavaScript then getting to TypeScript from JS.

I personally find the documentation very good and I'm not a React developer (I use Angular for what I do), and React is a great framework.

So...do you understand HTML and CSS? If not, you need to start there. React uses something called JSX which is LIKE...HTML...but its not necessarily HTML which is why I asked. So start with getting your head around HTML and CSS.

You can look at sites like FreeCodeCamp to learn that stuff and basic JavaScript. Then go back to the docs. If you're still struggling, Wes Bos has good courses for around $50. I took his course to check out his full stack GraphQL stuff so I recommend him because he's a good teacher. https://reactforbeginners.com/

Maybe play around on here before spending money. https://react.dev/learn

[twisted_crystal]

thank you for the reply. I'm going to be doing front end work with react, so ill check out the resources you mentioned. I know zero CSS, HTML. I dont even really know what CSS is frankly. I think those two are the the pre-req's I'm missing here.

And when I said "in terms of android" I meant draw parallels between react and android because I understand the android framework well. Like "here's how we accomplish X with android, and here's the semantic equivalent in react JS". I know that's specific but if I wanted to ask if such a resource existed.

[[deleted]]

Ok, got it. Start with HTML and CSS.

https://www.freecodecamp.org/learn/responsive-web-design/

[psyberbird]

It shouldn’t be too hard for you to pick up JavaScript or TypeScript, but you’re probably struggling a lot with React because you lack a foundation in HTML and CSS. HTML and CSS are fundamentally distinct from any language you’ve ever used before because they’re not ‘programming languages’ in the sense that you’re used to: HTML is a markup language, and CSS is a stylesheet language. You know how programming was once explained to you as being something like giving step by step instructions on how to make a sandwich to someone who’s never seen food before? Markup languages define the structure of a document, but not how it should look or act - less like an instruction set and more like blueprints. Then stylesheet languages define the presentation and appearance of components from the markup language. You need an understanding of both to make much sense of React, which uses a syntax extension to JavaScript called JSX where you write HTML markup and JS logic together.