【React应用程序百步挑战】02 计数器

1.png

首先

你好!@Sicut_study在这里!

 

這篇文章很高興獲得了許多人的閱讀。這讓我深切體會到React引起了許多初學者的關注。

就像我在文章中多次提到的那样。

如果你想要最快速地学习,无论如何你都需要去制作一些东西。

我认为关键是挑战「React应用程序100个任务」。我们打算逐渐增加难度,并看看能制作多少个题目来测试自己的能力。

我們將創建一個最適合學習useState的計數器應用程式!

上次的主题。

 

React应用程序100个挑战规则

    • 主要なライブラリやフレームワークはReactである必要がありますが、その他のツールやライブラリ(例: Redux, Next.js, Styled Componentsなど)を組み合わせて使用することは自由

 

    TypeScriptを利用する

02. 计数器

image.png

有什麼疑慮嗎?

创建一个柜台

此问题的目标是生成一个中文句子,存在许多可能的方式

理解 React 的基本概念: 使用计数器应用程序可以学习 React 的基本功能,如状态管理和事件处理。对于初学者而言,这是深入理解这些概念的好起点。

达成条件

    1. 领域表示:存在一个用于显示数字的区域。

 

    1. 递增按钮:点击此按钮,显示的数字将增加1。

 

    1. 递减按钮:点击此按钮,显示的数字将减少1。

 

    1. 初始显示:应用启动时的数字为0。

 

    状态管理:使用React的useState或useReducer来管理计数数字。

我亲自尝试解决了这个问题

运用科技

    • React

 

    • TypeScript

 

    • Vite

 

    Emotion

回答时间:25分钟

由于设计方面花费了很多时间,因为功能本身并不难
而且因为导入Emotion出现错误,也花了时间进行调查
您可以根据自己的喜好进行设计试试看,也许会不错。

最后

鉴于React100本挑战赛的文章我会认真发布,如果有人想一起挑战,请关注 @Sicut_study,非常感谢。如果您看到这里,请给我们点个赞和转发,谢谢。

稍微做一些宣传?????

我考虑挑战自己,在接下来的3个月里,认真地辅导那些想要成为工程师的人,希望能够帮助他们成为出色的工程师。

如果有人真的想成为工程师并希望接受指导的话,可以在Twitter上发送类似于”我想学习编程”的回复给我,我会很乐意提供帮助!

这就是以上的内容。
这个星期,再接再厉,努力学习编程吧!

bandicam 2023-10-04 20-58-54-525.jpg

下次

 

广告
将在 10 秒后关闭
bannerAds