Inflearn brand logo image
Inflearn brand logo image
BEST
개발 · 프로그래밍

/

프론트엔드

PWA 시작하기 - 웹 기술로 앱을 만들자

Web 기술로 오프라인 환경에서 작동하는 App 을 만들 수 있습니다. 프로그레시브 웹 앱이 발전해온 시대적 배경과 주요 특징을 배우고, 주요 기술들로 실제 프로그레시브 웹 앱을 만들어보세요.

(4.7) 수강평 32개

수강생 756명

이런 걸 배울 수 있어요

  • PWA의 기본 개념

  • 웹 앱 매니페스트 구성

  • 서비스 워커를 이용한 오프라인 웹 앱 제작

  • PWA 보조 라이브러리 활용

  • 실제 개발 환경 설정 및 디버깅

웹 개발자들의 새로운 무기!
프로그레시브 웹 앱을 재미있게 학습해요 😉

차근차근,
PWA 시작하기 ✍


웹을 통해 전달되는 응용 소프트웨어의 일종으로,
HTML/CSS/JS를 포함한 일반 웹 기술들을 사용해서 만들어집니다.
표준을 준수하는 브라우저를 사용하는 어떤 플랫폼에서도 동작하도록 만들어졌습니다.


어떤 걸 배우나요? 🕶

HTML/CSS/JS로 어떻게 모바일 애플리케이션 느낌이 나는 웹 애플리케이션을 만들 수 있는지 궁금하신가요? 본 강의에서는 프로그레시브 웹 앱이 발전해온 시대적 배경과 주요 특징을 배우고, 주요 기술들로 실제 프로그레시브 웹 앱을 만들어봅니다.
웹 앱 매니페스트 파일, 서비스 워커 등을 배우면서 제작할 때 실제로 마주치는 문제점들과 디버깅을 쉽게 하는 법에 대해 2년간 쌓아온 노하우를 공유합니다. 전체적인 강의 방식은 코드 중심의 학습형 강좌 형태로 구성되어 있습니다.

강좌는 크게 3가지 파트로 나뉩니다.

  • 프로그레시브 웹 앱 시연 및 소개
  • 웹 앱 매니페스트 파일 제작하기
  • 서비스 워커 다루기


누구에게 도움이 되나요? 🙋‍♀️

  • 모바일 기기에서도 사용성이 뛰어난 웹 애플리케이션을 만들고 싶은 프론트엔드 개발 입문자
  • HTML, CSS, Javascript로 모바일 앱을 만들어보고 싶은 웹 개발자
  • 웹 페이지의 성능과 사용자 경험을 높이고 싶은 프론트엔드 개발자
  • 웹 기술 밖에 모르는데 회사에서 모바일 앱을 제작해야 하는 퍼블리셔
  • 하이브리드 앱은 이제 벗어나고 싶다고 생각하는 하이브리드 앱 개발자

이미 대세인 기술 PWA


캡틴판교의
다른 강의가 궁금하다면?

인프런 베스트셀러,
캡틴판교 Vue.js 시리즈.

Vue.js 시작하기 (클릭)

Vue.js 중급 (클릭)

Vue.js 완벽 가이드 (클릭)

Vue.js 끝장내기 (클릭)


지식공유자 소개 👨‍🏫

장기효 (캡틴판교)

"인프런이 만난 사람" 인터뷰

“강의 수익으로 Vue.js 오픈소스 +
생활코딩을 후원합니다 😁”

강의 할인을 제공합니다!

시리즈 "Vue.js로 완성하는 프론트엔드
개발자 로드맵" 25% 할인 (클릭)

수입이 없는 중·고등학생,
대학생을 위한 학생 50% 할인 (클릭)

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • 웹 개발자

  • 프로그레시브 웹 앱에 관심 있는 사람

  • 오프라인 기능을 갖춘 웹 앱을 만들고 싶은 사람

  • 최신 웹 기술을 배우고 싶은 사람

안녕하세요
입니다.

47,763

수강생

4,608

수강평

3,812

답변

4.9

강의 평점

17

강의

인프런에서 8년째 지식을 공유하고 있습니다. 🏠 기술블로그, 📣 트위터, 💻 깃헙

📗 Do it! Vue.js 입문, 쉽게 시작하는 타입스크립트, 나는 네이버 프런트엔드 개발자입니다. 책 3권 집필
📖 Cracking Vue.js, 타입스크립트 핸드북, 웹팩 핸드북. 온라인 무료 가이드북 3권 집필
👨‍💻 캡틴판교의 프론트엔드 개발 유튜브 채널 운영 - 취준생, 주니어 개발자들의 고민을 들을 수 있는 곳
🥤 캡틴판교의 카카오톡 오픈 채팅방 운영 - 프런트엔드 개발 최신 정보와 업계 동료들의 생각과 고민을 들을 수 있는 곳

커리큘럼

전체

36개 ∙ (3시간 29분)

강의 게시일: 
마지막 업데이트일: 

수강평

전체

32개

4.7

32개의 수강평

  • mj님의 프로필 이미지
    mj

    수강평 2

    평균 평점 4.5

    4

    94% 수강 후 작성

    처음부터 자세하게 알려주셔서 처음 시작할때 아주 이해하기 쉬웠습니다. 배우고 둘러보니 실제 적용된곳이 생각보다 많더군요, 강의내용은 아주 만족합니다만 다만 pwa의 큰 강점중 하나인 알림 기능이 빠져있어서 살짝 아쉬운감이 있었습니다. 물론 구글링해보면 여러 자료가 많지만 그래도 아쉬운감이 있네요...

    • 프로그래머님의 프로필 이미지
      프로그래머

      수강평 2

      평균 평점 3.5

      4

      100% 수강 후 작성

      기본 개념잡기 좋네요. 다만 아쉬운건 alert가 빠지거나, 라이브러리 활용법이 조금 아쉽습니다. 그리고 github에 제공된 branch가 없는 부분들이 존재합니다

      • 민승호님의 프로필 이미지
        민승호

        수강평 1

        평균 평점 5.0

        5

        100% 수강 후 작성

        PWA 입문의 첫발을 디뎠습니다. 친절하고 자세한 강의 덕분에 PWA에라는 생소한 기술에 입문을 하게되었습니다. 이미 많은 분들이 사용하고 계신 것같은데 아직은 관련도서도 적은 편이라서 막막했는데 덕분에 시작하는데 큰 도움이 되었습니다. 다만 강의에서 설명해주시는 소스나 강의 교안은 저희도 미리 받을 수 있으면 일일히 기입하느라 강의에 집중하지 못하는 경우를 줄일 수 있을 것 같습니다. 저작권때문에 공개하기 어려우신 것 같은데 다른 방법으로도 유출 가능하므로 강의 수강자에게는 PDF형태로라도 요약본으로라도 제공되었으면 합니다. 제경우 따라하는 중간에 오류가 나서 시간이 좀 걸렸네요.

        • mrjang210님의 프로필 이미지
          mrjang210

          수강평 2

          평균 평점 4.5

          4

          100% 수강 후 작성

          기초 쌓기에 좋았습니다.

          • promotion님의 프로필 이미지
            promotion

            수강평 11

            평균 평점 4.9

            5

            100% 수강 후 작성

            감사합니다 :)

            장기효(캡틴판교)님의 다른 강의

            지식공유자님의 다른 강의를 만나보세요!

            비슷한 강의

            같은 분야의 다른 강의를 만나보세요!