0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【React】100本ノック #01 Hello World

Posted at

はじめに

フロントエンドスキル向上のため書籍やudemyでインプットを行っていますが、アウトプットも並行して進めるべく@Sicut_studyさんのReact100本ノックを始めることにしました。

ルール

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

今回作るもの

画面上に「Hello World」を表示するReact コンポーネントの作成

条件

1. Reactの新しいプロジェクトが正しくセットアップされていること。
2. 画面に"Hello World"というテキストが中央に表示されていること。

成果物

使用技術

  • React
  • TypeScript
  • Emotion

スタイルに関しては、以前MUI(Material-UI)は何度か使用経験があったので、今回は全く別の方法で実装しようと思い、@Sicut_studyさんと同様にEmotionを使ってみることにしました。

PC

01_helloworld_pc.png

SP

01_helloworld_sp.png

感想

プロジェクト作成、アプリ作成、デプロイの大まかな流れを掴むことができました。
Reactについて、より理解を深めるために引き続き100本ノックを継続していきたいです。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?