-
Resuming in 202202
- I remember stopping around when I was going through the official React tutorial.
- Let’s try the React Beginner Tutorial.
It’s also recommended to refer to /mrsekut-p (takker).
- It has comprehensive notes on learning React and TypeScript.
- (blu3mo)🙏
-
I want to quickly learn how to create something that works on the web.
-
I did some basic JavaScript back in fifth grade.
-
But it seems like the world has completely changed.
- https://note.com/erukiti/n/n38495d44386a
-
“Reset all your knowledge, experience, and common sense about HTML/CSS/JS. To put it more simply, forget everything about web technology. Read all the official documentation and unlearn.”
-
If you have ever worked with JavaScript back then (i.e., before ES5), you probably had some dissatisfaction with it. You recognized that it was a language clearly inferior to other languages like Ruby, Scala, and Go. And you were not wrong.
- https://note.com/erukiti/n/n38495d44386a
-
The web front-end used to be a world where you could simply manipulate the DOM directly or play with toy-like scripts. But that era is long gone. Unlike the Stone Age, abstractions like virtual DOM have been introduced.
-
For now, I’m thinking of learning React and TypeScript (20210325).
- I’ll think about the backend later. I have some knowledge of Ruby On Rails, but I’m not sure if I’ll use it.
-
If you really just want to create an app with React, I strongly recommend doing it on UserScript (takker).
- If you try to build everything from scratch, you’ll get stuck in non-essential parts and lose track of the essence.
- You wanted to use React to build an app, but somehow you end up spending time on environment setup.
- Learn how to use npm/yarn.
- Learn how to write package.json.
- Learn how to configure webpack.
- Configure eslint and prettier in the editor.
- Only after doing all this, you can finally start development.
- You will make configuration mistakes at each step, so you’ll need to figure out the cause every time.
- You wanted to use React to build an app, but somehow you end up spending time on environment setup.
- On UserScript, you can make things work just by copying and pasting.
- For example,
- [/programming-notes/Preactを使ったScrapbox UserScriptのDemo (TODO app)#609648cc1280f000004c75b7](https://scrapbox.io/programming-notes/Preactを使ったScrapbox UserScriptのDemo (TODO app)#609648cc1280f000004c75b7)
- /pokutuna/プレゼンタイマー
- After copying and pasting them into a suitable page, you can immediately use them by importing them into your own page.
- You can even execute them by writing them in the development console using the dynamic import syntax.
- You can start creating your own app immediately by modifying the contents.
- If you don’t want to import Preact libraries from an external project, you can simply copy and paste them into your own page.
- Since the file size is small, it’s easy to copy and paste.
- If you don’t want to import Preact libraries from an external project, you can simply copy and paste them into your own page.
- For example,
- It eliminates the need to implement the basics of an app.
- The site’s UI and text editor are already provided.
- All you have to do is implement the features you want on top of that.
- However, there are limitations.
- It requires some effort to use third-party libraries.
- There are no linters or formatters.
- Keep reloading with F5 until the errors are gone.
- Then debug using the developer tools.
- You can’t use TypeScript.
- You have to rely on mental type inference.
- If you try to build everything from scratch, you’ll get stuck in non-essential parts and lose track of the essence.
-
If you’re okay with starting from scratch, CodeSandBox is recommended.
- No need for environment setup.
- You can use TypeScript.
- You can use any third-party packages.
- It automatically rebuilds the app every time you edit it.
- It can be integrated with GitHub.
- You can deploy to Vercel with just one click.
-
I want to take the shortest route to becoming an iOS engineer.
-
This looks promising.
- Reactチュートリアル1:犬画像ギャラリーを作ろう- React Beginner Tutorial by takker seems to be good. (takker)
- 🙏🙏 (blu3mo)
- React Beginner Tutorial
-
React Hooks Introduction is also good for those who recently started with React.
- Other pages are also helpful.
-
Random notes:
- There are props and state in React. Props refer to the attributes written in JSX syntax like
<tag param=value>
.- The attributes written inside
<...>
are just HTML tags. (takker)<...>
itself is just an HTML tag.
- The attributes written inside
- When something is specified in the state (setState), it will trigger a render when it is updated.
- Instead of re-rendering everything, React creates a Virtual DOM and compares it to update only the necessary parts. This is why React is valuable.
- That’s what I think.
- There are props and state in React. Props refer to the attributes written in JSX syntax like