인프런 영문 브랜드 로고
인프런 영문 브랜드 로고
BEST
개발 · 프로그래밍

/

풀스택

따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]

이 강의를 통해서 리액트와 파이어베이스를 이용해서 채팅 어플리케이션을 만들수 있습니다.

(4.7) 수강평 42개

수강생 1,007명

Thumbnail

초급자를 위해 준비한
[풀스택, 웹 개발] 강의입니다.

이런 걸
배워요!

  • 리액트

  • 파이어베이스

따라하며 배우는 채팅 애플리케이션 만들기, 
핵심 기능을 하나하나 따라 학습해보세요!

안녕하세요 ^ ^ 
이 강의에서는 처음부터 기능 하나하나,
한페이지 한페이지씩 직접 채팅 애플리케이션을 만들어 봅니다.

이 강의는 비록 노드는 사용하지 않지만 
노드 + 리액트 기본 선수지식이 있으면 더 이해하기 쉽기 때문에,
노드 + 리액트를 학습하지 않으신 분들은 다음 강의를 먼저 학습하시면 좋습니다.

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
실제 웹앱을 만들기 위한 노드 + 리액트 기초 개념 학습

💡 강의 특징

John Ahn, Firebase

 실시간 스트리밍 프로토콜(RTSP) 방식 지원 

파이어베이스(Firebase)는 인증, 데이터베이스, 스토리지, 푸시 알림, 배포 등
대부분의 앱을 만들 때 필요한 부분들을 자동으로 만들어 주는 플랫폼으로,
실시간(Real-Time) 데이터 전송이 필요한 채팅 앱, 택시 앱 등을 쉽게 구현할 수 있습니다.

채팅 애플리케이션의 핵심 기능들을 최대한 많이 넣으려고 노력했으며, 
만드는 과정에서 어려운 로직들이 많이 들어가기에
설명을 하는 가운데 이해가 잘 되실 수 있도록 도표를 이용하며,
왜 이 부분이 이렇게 되는지 실제로 보여드리면서 강의가 진행되도록 노력하며 만들었습니다. 

 


💻 사용 스킬 & 학습 내용

▲ 자바스크립트(JavaScript), 리액트(React), 리덕스(Redux) 관련 선수 지식이 필요합니다. 

  • 로그인/회원가입, 유효성 체크
  • DM에 가입된 유저 실시간 반영, DM 메시지방
  • 채팅방 생성, 설명 추가, 즐겨찾기 추가/삭제
  • 메시지 알림 개수 표시
  • 공개방에서 대화하기
  • 상대방 대화 입력 시 알려주기
  • 채팅 검색, 스켈레톤 효과
  • 파일 업로드 퍼센테이지 보여주기
  • 유저 이미지 교체, 이미지 메시지 보내기
  • 애플리케이션 배포
  • etc.

🧰 여기서 다루는 툴

Visual Studio Code를 사용하지만 자신이 원하는 Editor를 사용해도 됩니다. 
MAC을 사용하지만 윈도우에서도 가능합니다.


🙋🏻‍♂️ Q&A

Q. 비전공자도 들을 수 있나요?
A. 넵! 전공자, 비전공자 상관없이 들을 수 있는 강의입니다.

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • 즐겁게 코딩을 하고 싶은 사람

  • 최신 기술에 관심이 있는 사람

선수 지식,
필요할까요?

  • 자바스크립트

  • 리액트

안녕하세요
John Ahn입니다.

수강생 수

80,101

수강평 수

2,560

강의 평점

4.8

강의 수

19

안녕하세요. 

즐겁게 개발하고 있는 개발자입니다. 

앞으로 많은 도움을 드릴 수 있었으면 좋겠습니다.


- 따라하며 배우는 도커와 CI환경 저자
- 카카오 기업 신입 공채 FE 교수자
- 패스트캠퍼스, 구름 강사 
- 현대자동차 개발 기업 교육
- 신한은행 메타버스, 코빗 타운 풀스택 개발
- 여러 공공기관 SNS 풀스택 개발

커리큘럼

전체

142개 ∙ (19시간 4분)

수업 자료

가 제공되는 강의입니다.

  • 소스 코드 자료

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

    수강평

    아직 충분한 평가를 받지 못한 강의입니다.
    모두에게 도움이 되는 수강평의 주인공이 되어주세요!