Thumbnail
개발 · 프로그래밍 모바일 앱 개발

지금 당장 플러터 앱 개발 [ToDo 리스트] 대시보드

(1)
1개의 수강평 ∙  33명의 수강생

33,000원

지식공유자: 지금 당장
총 85개 수업
수강기한: 
무제한
수료증: 발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

초급자를 위해 준비한
[모바일 앱 개발] 강의입니다.

이 강의를 통해 플러터로 모바일 앱을 개발하는 방법을 배웁니다. 더 이상 안드로이드와 iOS 앱 개발을 따로 배우지 마세요! 플러터 앱에서 UI를 개발하고 해당 UI를 백엔드 API와 연동하며, 데이터를 전역적으로 관리 할 수 있는 상태관리 패턴 Provider를 배웁니다.

✍️
이런 걸
배워요!
플러터 앱 UI 개발
플러터 앱 UI와 API 연동
플러터 상태관리 패턴 provider

생산성 높은 앱 개발 프레임워크 플러터, 
백엔드 API 연동에 도전해보세요. 

💾 수강 전 확인해주세요.

  • 이 강의는 텍스트 형태의 강의입니다. 수강 전 강의 [미리보기] 수업을 반드시 확인해주시기 바랍니다. (별도의 영상이 수록되어 있지 않습니다.)

플러터 앱 UI 개발 +
백엔드 API 연동

이 강의에서는 플러터(Flutter)로 앱을 개발하는 방법을 배웁니다. 
플러터 앱에서 UI를 개발하고 해당 UI를 백엔드 API와 연동하며, 데이터를 전역적으로 관리할 수 있는 상태관리 패턴 Provider를 학습합니다.

생산성을 높이고 싶다면

백엔드 개발자이지만 앱 개발을 하고 싶었던 제가 플러터를 선택한 이유는 간단합니다. 플러터 프레임워크로 개발을 하면 안드로이드, iOS를 모두 지원하기 때문입니다.

아울러 VSCode 환경에서 개발할 수 있기 때문에 기존 Android Studio나 XCode 대신 대중적으로 쓰이는 개발 환경에서 개발함으로써 생산성 높은 개발을 할 수 있습니다.

플러터 앱 - 백엔드 API 연동까지

플러터 앱과 백엔드 API를 연동하는 자료를 찾기 어려웠습니다. 강의와 책은 많이 나왔지만 백엔드 API와 연동하는 예제는 드물었습니다. 파이어베이스와 연동하는 예제는 많았지만 로그인, 회원가입, ToDo, 카테고리, 템플릿 등 인증이 필요한 API와 연동하는 서비스가 없었습니다. 

백엔드 API와 연동하지 않고 SQLite, Firebase만 사용해서는 구직 시장이나 서비스 개발에 한계가 명확합니다.

이 강의의 특징

  • ✅ 파이어베이스 및 SQLite를 사용하지 않습니다.
  • ✅ 플러터 앱에서 백엔드 API를 연동해 데이터를 다루는 방법을 다룹니다.
  • ✅ 백엔드 API로는 NestJS를 제공합니다. NestJS로 생성한 Swagger API 문서를 제공합니다.

이런 분들께 추천합니다

  • 👩 모바일 앱 개발을 하고 싶은데 Android/iOS 둘 중 한 분야만 공부하는 게 불만족스러운 분
  • 👨 눈으로 볼 수 있는 화면을 개발하고 싶은 백엔드 API 개발자
  • 👩 모바일 앱 프론트 개발이 필요한 웹 프론트엔드 개발자

강의 목표

🚩 아래와 같은 플러터 UI를 개발하고 해당 UI가 NestJS 백엔드 API와 연동하는 방법을 제공합니다. 또한 API 문서를 보고 개발해야 하기 때문에 NestJS에서 자동 생성한 Swagger API 문서를 제공합니다.

1. 플러터 UI

2. Swagger API 문서 제공

학습 내용

1. 플러터 UI 

2. 백엔드 API 연동: Repository

  • 회원가입, 로그인, 내 정보 보기 등의 화면은 백엔드 API와 연동이 필요합니다.
  • NestJS로 작성한 백엔드 API를 실행하는 방법을 제공합니다.

3. 상태관리 패턴: Provider 

  • 백엔드로 API를 가져와서 바로 화면에 보여줄 수 없습니다. 중간에 상태관리 패턴 Provider 를 이용해야 합니다.
  • 플러터 UI ↔ Provider (전역 변수 관리 - 상태관리 패턴) ↔ 리포지토리 (API 연동)

강의 지식공유자
지금 당장

이력 사항

  • Flutter, VueJS, NestJS, AWS 개발자
  • 컴퓨터 전공 학사 및 석사 졸업 
  • 6개 회사에서 개발 경험
  • 여러 개의 개인프로젝트 경험

이런 분들께 추천드려요!

🎓
학습 대상은
누구일까요?
생산성이 높은 개발자가 되고 싶은 분
플러터에서 백엔드 API와 연동하는 방법을 배우고 싶은 분
📚
선수 지식,
필요할까요?
기본적인 코딩 변수, 배열, 조건문, 반복문 등

안녕하세요
지금 당장 입니다.
지금 당장의 썸네일
커리큘럼 총 85 개
이 강의는 수업 노트, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 서비스 소개
섹션 3. 플러터 구조 설명
섹션 4. API 설계
섹션 6. 개발 환경 세팅
vscode
도커
MySQL Workbench
NestJS (백엔드)
포스트맨
Flutter (모바일 앱)
섹션 7. 소스 코드 단계별 실습
초기 환경 세팅 미리보기 공통 화면 UI (SplashScreen, IndexScreen, TabBar) 미리보기 [회원 가입] 화면 UI 미리보기 [회원 가입] API 연동 미리보기
[로그인] 화면 UI
[로그인] API 연동
[프로필] 화면 UI
[프로필] API 연동
[프로필] 상태관리
[카테고리 리스트] 화면 UI 미리보기 [카테고리 리스트] API 연동 미리보기 [카테고리 리스트] 상태관리 미리보기
[카테고리 추가] 화면 UI
[카테고리 추가] API 연동
[카테고리 추가] 상태관리
[카테고리 수정] 화면 UI
[카테고리 수정] API 연동
[카테고리 수정] 상태관리
[카테고리 삭제] 화면 UI
[카테고리 삭제] API 연동
[카테고리 삭제] 상태관리
[Todo 리스트] 화면 UI
[Todo 리스트] API 연동
[Todo 리스트] 상태관리
[Todo 날짜 이동] 화면 UI
[Todo 날짜 이동] 상태관리
[Todo 추가] 화면 UI
[Todo 추가] API 연동
[Todo 추가] 상태관리
[Todo 수정] 화면 UI
[Todo 수정] API 연동
[Todo 수정] 상태관리
[Todo 삭제] 화면 UI
[Todo 삭제] API 연동
[Todo 삭제] 상태관리
[템플릿 리스트] 화면 UI
[템플릿 리스트] API 연동
[템플릿 리스트] 상태관리
[템플릿 추가] 화면 UI
[템플릿 추가] API 연동
[템플릿 추가] 상태관리
[템플릿 수정] 화면 UI
[템플릿 수정] API 연동
[템플릿 수정] 상태관리
[템플릿 삭제] 화면 UI
[템플릿 삭제] API 연동
[템플릿 삭제] 상태관리
[모든 템플릿 카테고리 리스트] 화면 UI
[모든 템플릿 카테고리 리스트] API 연동
[모든 템플릿 카테고리 리스트] 상태관리
[템플릿에 카테고리 추가] 화면 UI
[템플릿에 카테고리 추가] API 연동
[템플릿에 카테고리 추가] 상태관리
[템플릿에서 카테고리 제거] 화면 UI
[템플릿에서 카테고리 제거] API 연동
[템플릿에서 카테고리 제거] 상태관리
[템플릿 복사] 화면 UI
[템플릿 복사] API 연동
[템플릿 복사] 상태관리
강의 게시일 : 2023년 03월 06일 (마지막 업데이트일 : 2023년 03월 06일)
수강평 총 1개
수강생분들이 직접 작성하신 수강평입니다.
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
21913675 thumbnail
1
문서로만 강의를 만들었으면 문서로 충분히 이해하고 실행될 설명이 첨부되어야 할 것 같아요 매우 비추
2023-06-27