강의

멘토링

커뮤니티

Programming

/

Front-end

誰よりも早く作ってみるElectron Todo List With TypeScript

誰よりも早く試してみるElectron Todo List With TypeScript Reactベースのデスクトップ動作サービスを作ることができるElectronをTypeScriptで開発してみましょう!

難易度 入門

受講期間 無制限

  • Neo
실습 중심
실습 중심
토이프로젝트
토이프로젝트
리액트감잡기
리액트감잡기
electron
electron
React
React
TypeScript
TypeScript
Electron
Electron
Portfolio
Portfolio
실습 중심
실습 중심
토이프로젝트
토이프로젝트
리액트감잡기
리액트감잡기
electron
electron
React
React
TypeScript
TypeScript
Electron
Electron
Portfolio
Portfolio

学習した受講者のレビュー

学習した受講者のレビュー

4.9

5.0

HelloWorld

100% 受講後に作成

真似しやすくて良いです。入門用として考えると良いです

5.0

DKN

100% 受講後に作成

深い内容は期待していませんでしたが、やってみて入門用にはぴったりのようですね。良いです。

5.0

wonder

100% 受講後に作成

いいですね

受講後に得られること

  • TodoListを作りながらElectronをかじってみる

  • Reactベースのデスクトップアプリがどのように作られるかを調べてみる

誰よりも早く試すElectron Todo List With TypeScript

React、TypeScript、Electron、ポートフォリオ

ウェブ技術で作るデスクトップアプリケーション!
React + TypeScript + ElectronでTodoアプリを作ってみましょう。

🎯 講義紹介

この講義はウェブ開発者でも簡単にデスクトップアプリケーションを作れるように
ElectronとTypeScriptを最初から最後まで実習中心で学ぶ講義です。

一度のコードでWindows、macOS、Linuxで動作するアプリを作ってみて、
ReactとTypeScript(Electron移植)で構成されたTodoリストアプリケーションを直接完成させます。

🧩 このような内容を学びます

セクション主要学習内容

1. TypeScript基礎 型システム、関数とインターフェース、クラス、ジェネリックなど核心文法整理

2. Electronを理解するElectronの構造、メリット・デメリット、Node.js & Chromiumベースの理解

3. 開発環境セットアップ VSCode、Node.js、nvmのインストールからReactプロジェクトの初期セットアップまで

4. Electronとの連携React + Electron環境の構築とnpm run devでの同時実行

5. Todoアプリの作成 TypeScriptとReactでTodo CRUD機能の実装

6. 仕上げ & ビルド完成したアプリを実行ファイルとしてパッケージングする方法の紹介

🧠 学習目標

  • TypeScript文法を正確に理解し、プロジェクトに適用できる。

  • Electronの動作構造を理解し、ReactアプリとElectronを連携できる。

  • ✅ 一つのコードでクロスプラットフォームデスクトップアプリを開発できる。

  • React + TypeScript + Electronの統合開発環境を直接構築できる。

📚 開発過程および注意事項

React + TypeScriptでToDoリストWebを開発し、Electronでポーティングしてデスクトップアプリを作成します。
講義はReact + TypeScript + Electronを使ってみることに焦点を当てています。

上級講義は今後提供予定ですので、基礎講義であることを確認してから受講してください!

こんな方におすすめです

ウェブ技術でデスクトップアプリを作ってみたい開発者

React + TypeScript
Electron

環境を一度に身につけたい方

TypeScript文法を
実戦プロジェクトで練習したい方

受講前の参考事項

実習環境

  • 講義はMacOS基準で説明します。Windowsマシンでも付いてこられます。

  • 講義ではVSCodeを使用します。

  • 講義はElectron + TypeScriptの使用を目的としています!

学習資料

  • Notionリンクで提供いたします!

前提知識および注意事項

  • 基礎コンピュータ活用能力

こんな方に
おすすめです

学習対象は
誰でしょう?

  • Reactを学んでより深く入っていきたい方

  • デスクトップサービスを開発する方法を知りたい方

  • Electronについて気になった方

前提知識、
必要でしょうか?

  • TypeScript

  • React

こんにちは
です。

2,253

受講生

253

受講レビュー

38

回答

4.7

講座評価

29

講座

안녕하세요! 인프런에서 강의를 진행하고 있는 Neo 입니다.

평소 접하지 못했던 개발기술들을 다양한 분들이 접할 수 있도록 하는게 제 목표입니다.

그래서 저는 단순한 이론 나열보다 실무 중심의 커리큘럼을 구성하고, 트러블슈팅 없이 배울 수 있는 실습 위주의 강의를 제공하고자 합니다.

초보자도 부담 없이 따라올 수 있도록 최대한 가볍고 친절한 접근으로 내용을 구성하고 있으며, 지식에 대한 진입 장벽을 낮추는 것에 특히 집중하고 있습니다.
가끔은 마음이 같은 분들과 함께 강의 작업을 진행하기도 합니다!

협업 및 기타 비즈니스 문의는 yeseong0412@gmail.com 으로 부탁드립니다!

カリキュラム

全体

8件 ∙ (50分)

講座掲載日: 
最終更新日: 

受講レビュー

全体

8件

4.9

8件の受講レビュー

  • dkssudgktpdy님의 프로필 이미지
    dkssudgktpdy

    受講レビュー 20

    平均評価 5.0

    5

    100% 受講後に作成

    真似しやすくて良いです。入門用として考えると良いです

    • human2642622님의 프로필 이미지
      human2642622

      受講レビュー 71

      平均評価 5.0

      5

      38% 受講後に作成

      • yeseong0412
        知識共有者

        ありがとうございます〜!!

    • edwards님의 프로필 이미지
      edwards

      受講レビュー 17

      平均評価 5.0

      5

      38% 受講後に作成

      • yeseong0412
        知識共有者

        講義を聞いてくださってありがとうございます〜!

    • fain9301님의 프로필 이미지
      fain9301

      受講レビュー 97

      平均評価 4.8

      4

      75% 受講後に作成

      良い講義をありがとうございます。

      • loward님의 프로필 이미지
        loward

        受講レビュー 21

        平均評価 5.0

        5

        100% 受講後に作成

        深い内容は期待していませんでしたが、やってみて入門用にはぴったりのようですね。良いです。

        ¥1,214

        Neoの他の講座

        知識共有者の他の講座を見てみましょう!

        似ている講座

        同じ分野の他の講座を見てみましょう!