143,000원
월 28,600원
5개월 할부 시
입문자를 위해 준비한
[웹 개발] 강의입니다.
왕초보도 할 수 있는 웹, 서버, 모바일 앱, 머신러닝까지 익히는 끝판왕 풀스택 강의!! 개발을 어디서부터 시작할지 막막했다면 이 강의를 강력 추천할게요. Javascript 하나로 진행합니다!
✍️
이런 걸
배워요!
이런 걸
배워요!
HTML, CSS, JS 기본
웹 개발 (React)
모바일 앱 개발 (React Native)
서버 개발 (Node.js)
머신러닝 개발 (Tensorflow js)
Git
클라우드
필수 개발 지식
쉽고 다양하게 활용되는 Javascript 로 공부해요!
상대적으로 쉬운 난이도로 입문자가 배우기에 적합하고 모든 분야에서 활용될 수 있어요!!
이런 걸 만들 거예요👀
상품을 사고 팔 수 있는 '그랩마켓' 서비스를 단계별로 구축합니다.
궁금해요 🙋♂️🙋♀️
Q. 이 강의에서 무엇을 배울 수 있나요?
프론트엔드
- HTML, CSS, FlexBox
- Javascript, ES6
- React 라이브러리
- Antd, React-Router 라이브러리
- Postman
- 반응형 웹 등
백엔드
- Node.js
- Express 프레임워크
- Sqlite 데이터베이스 + Sequelize ORM
- 이미지 파일 처리(multer)
- 클라우드(Vercel, Heroku)
- 상품 추천 API
머신러닝
- Tensorflow.js
- 머신러닝, 딥러닝 메카니즘
- Mobilenet
모바일 앱
- React Native
- Expo
- React Navigation
- ngrok
기타
- Git & Github 버전관리
- 추가 개발 지식 (REST API, JSON 등)
Q. 개발을 모르는 비전공자인데 할 수 있을까요?
비전공자도 충분히 학습할 수 있도록 심혈을 기울여 만들었어요!
- 한 강의에 많은 걸 알려주지 않습니다. 배운 내용을 계단 삼아 단계별로 학습합니다.
- 어려운 개념은 반복적으로 설명 및 활용합니다.
- 저 그랩은 이미 수많은 비전공자를 대상으로 글을 쓰고 강의를 진행했어요 :)
- 궁금한 점은 실시간으로 빠르게 답변드려요!
Q. 완강하고 난 다음에 뭘 해야 할까요?
본 강의를 들었다고 풀스택 개발자가 되는 것은 아닙니다. (절대!!)
가장 먼저 지금까지 배운 지식을 토대로 본인이 관심 있는 분야를 정해서 전문성을 쌓는 걸 추천드립니다. 프론트엔드, 백엔드, 모바일 앱, 머신러닝 모두 좋아요. 그래도 헷갈리신다면 질문을 남겨주세요. 빠르게 답변드릴게요!
개인 프로젝트, 스터디, 온라인 강의 등을 활용해서 한 분야의 전문성을 쌓으세요. 여러분이 꿈꾸는 모습으로 한 걸음씩 전진하다 보면 어느새 전문가가 되어있을 겁니다.💪🏼
마지막으로 드리고 싶은 말
배우고자 하는 의지와 꾸준함만 있다면 여러분들 모두 충분히 하실 수 있어요! 저 그랩과 함께 느리더라도 꾸준히 하다 보면 어느 순간 개발 커리어의 초석을 쌓을 수 있을 거예요.
수업 때 다시 인사드리도록 할게요.😄 감사합니다.
다른 추천 강의 🙂
IT 기업의 개발자들이 실제로 하는 일을 배워보세요.
실제 업무 관점의 전반적인 프로세스를 통해 큰 그림을 그려드려요.
실제 업무 관점의 전반적인 프로세스를 통해 큰 그림을 그려드려요.
이런 분들께 추천드려요!
🎓
학습 대상은
누구일까요?
학습 대상은
누구일까요?
개발을 배우고 싶은 비전공자
다양한 개발 분야를 배워보고 싶은 분들
어려웠던 코딩 수업에 지친 분들
IT 회사에서 개발자와 긴밀하게 협업하는 분들
📚
선수 지식,
필요할까요?
선수 지식,
필요할까요?
진심으로 배우고자 하는 열정
안녕하세요
그랩 입니다.
그랩 입니다.
학습과 성장에 관심이 많은 개발자&크리에이터 그랩입니다.
[이력]
現) Project Pluto Tech Lead
前) 쏘카 데이터 엔지니어 (다수 프로젝트 리드)
前) 그로스 컨설팅 팀 '해킹그로스' 엔지니어
前) 클래스 101 백엔드 엔지니어
前) Microsoft 개발자대회 Imagine Cup 한국 1등 선발
前) 지식공유 스타트업 '원더풀램프' 창업
前) 3D 디스플레이 스타트업 'Tomorrance' 창업
[대외 활동 내역]
마이리얼트립 임직원 대상 개발지식 현장 강의
픗픗 아카데미 IT 개발자를 위한 개발지식 현장 강의
리디셀렉트 IT 비개발자를 위한 개발지식 연재
클래스101 개발자 입문 강의 촬영
IT 개발자와 일할 때 필요한 모든 개발지식 실시간 강의
에듀테크 기업 '스펙업 애드' 임직원 50명 대상 안드로이드 단체 강의
[운영 채널]
뉴스레터 - 그랩의 IT 뉴스레터
블로그 - 개발지식 A to Z
브런치
유튜브
그랩에 대해 더 궁금하시다면 클릭👆
커리큘럼
총 118 개
˙ 19시간 31분의 수업
이 강의는 영상, 수업 노트, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. INTRO
2 강
∙ 10분
섹션 1. --- Stage 1 ----
1 강
프로그래밍이 익숙해지는 환경 만들기
섹션 2. HTML & CSS 기본
12 강
∙ 2시간 6분
html & css 개요
미리보기
05:36
html 공부하기 - 1
10:39
html 공부하기 - 2
09:53
html 공부하기 - 3
12:51
css 공부하기 - 1
06:58
css 공부하기 - 2
05:40
css 공부하기 - 3
16:53
flex layout 공부하기 - 1
미리보기
11:11
flex layout 공부하기 - 2
09:25
[그랩마켓] 웹 화면 구현하기 - 1
10:30
[그랩마켓] 웹 화면 구현하기 - 2
10:14
[그랩마켓] 웹 화면 구현하기 - 3
미리보기
16:38
섹션 3. Javascript 기본
15 강
∙ 2시간 16분
javascript 개요
04:09
변수 - 1 (기본 자료형)
12:46
변수 - 2 (배열, 객체)
17:05
변수 Question
07:02
연산자
08:46
연산자 Question
04:04
조건문
09:47
조건문 Question
04:23
함수
16:30
함수 Question
05:24
반복문
08:54
반복문 Question
06:25
자바스크립트 Wrap-up Question
미리보기
08:36
[그랩마켓] Javascript 적용하기 - 1
미리보기
09:38
[그랩마켓] Javascript 적용하기 - 2
12:46
섹션 4. HTTP 서버 통신
8 강
∙ 1시간 14분
Javascript 콜백과 익명함수
11:34
Javascript 비동기 처리
11:18
서버 개요
06:42
HTTP 개요
10:55
Axios 사용하기
08:55
Postman 이용하기
11:55
JSON이란
03:01
[그랩마켓] axios로 네트워크 통신하기
09:47
섹션 5. Modern Javascript (ES6)
6 강
∙ 35분
ES6 개요
06:04
Template Literal
04:30
Destructuring(비구조화 할당)
03:58
map, forEach
10:32
Lambda Function
05:46
ternary operator(3항 연산자)
04:37
섹션 6. --- Stage 2 ----
0 강
섹션 7. 웹 개발하기 (React)
13 강
∙ 1시간 33분
React를 사용하는 이유
미리보기
03:40
Node & NPM 이해하기
07:49
React 시작하기
04:19
React 프로젝트 구조 파악하기
03:38
React 특징
05:16
export, import 개념 파악하기
03:43
컴포넌트 사용하기
10:11
jsx 사용하기
06:08
props 사용하기
05:33
state 사용하기
11:10
useEffect 사용하기
05:54
[그랩마켓] React로 웹 개발하기 - 1
10:11
[그랩마켓] React로 웹 개발하기 - 2
16:23
섹션 8. 버전 관리 (Git & Github)
3 강
∙ 19분
Git & Github 개요
04:01
[그랩마켓] Git Commit 적용하기
09:15
[그랩마켓] Github에 소스코드 업로드하기
06:07
섹션 9. 웹 라이브러리 (React-router-dom, Antd)
8 강
∙ 1시간 39분
react-router-dom 설치하기
09:00
Link 적용하기
13:04
상품 상세 페이지 구현 - 1
12:15
상품 상세 페이지 구현 - 2
11:32
상품 상세 페이지 구현 - 3
06:52
Antd 적용하기
14:58
상품 업로드 페이지 구현 - 1
12:24
상품 업로드 페이지 구현 - 2
19:15
섹션 10. HTTP 서버 개발하기 (Node, Express)
7 강
∙ 1시간 1분
API 개요
06:51
URL 구조 이해하기
08:50
간단 Node 서버 구축하기
13:07
그랩 마켓 서버 구축하기
06:08
Express 프레임워크 사용하기
10:37
그랩마켓 웹과 상품 정보 연동하기
04:06
Express에서 데이터 처리하기
11:42
섹션 11. 서버에 데이터베이스 연동하기
5 강
∙ 57분
데이터베이스 개요
07:36
Sequelize, Sqlite 설치하기
16:20
상품 생성, 조회 API 구현
10:44
상품 상세 조회 API 추가
09:33
웹과 API 연동하기 & dayjs로 날짜 다루기
12:54
섹션 12. 서버 파일 처리 (multer) & 그랩 마켓 구현 완료
6 강
∙ 1시간 4분
파일 처리 개요
05:03
multer 적용하기
11:34
상품 업로드 기능 구현 - 1
13:44
상품 업로드 기능 구현 - 2
11:07
그랩마켓 최종 구현
16:41
REST API란?
06:10
섹션 13. 그랩 마켓 발전시키기
4 강
∙ 57분
슬라이딩 배너 구현
16:24
결제하기 구현 - 1
09:12
결제하기 구현 - 2
17:20
반응형 웹
14:53
섹션 14. 클라우드 (Heroku, Vercel)
3 강
∙ 26분
클라우드 개요
06:54
Fly.io 에 그랩마켓 서버 배포하기
08:15
Vercel에 그랩마켓 웹 배포하기
11:36
섹션 15. 모바일 앱 개발하기 (React Native, Expo)
5 강
∙ 35분
React Native 개요
06:36
Expo 설치하기
11:11
Android Studio 설치
03:02
Xcode 설치 (only 맥 유저)
03:10
React Native와 React의 차이점
11:36
섹션 16. 모바일 앱 개발하기2
7 강
∙ 1시간 52분
메인 화면 구현 - 1
17:03
ngrok 설치하기
04:49
메인 화면 구현 - 2
16:30
메인 화면 구현 - 3
26:27
react-navigation 적용하기
21:49
상품 상세 화면 개발 - 1
13:56
상품 상세 화면 개발 - 2
11:30
섹션 17. 머신러닝 개발 (Tensorflow js)
3 강
∙ 24분
머신러닝&딥러닝 개요
05:06
딥러닝 메카니즘 이해하기
06:31
tensorflow js로 머신러닝 모델 구현하기
12:54
섹션 18. 그랩 마켓에 머신러닝 적용하기 (Mobilenet)
5 강
∙ 1시간 9분
상품 분류 로직 구현하기
14:08
상품 업로드 API에 분류 로직 연동하기
12:31
상품 추천 API 구현하기
09:55
웹에 추천 기능 연동하기
17:01
모바일 앱에 추천 기능 연동하기
16:10
섹션 19. 개발자로 나아가기
4 강
∙ 1시간
프론트엔드 개발자
19:22
백엔드 개발자
21:58
빠르게 학습하는 방법
10:14
좋은 회사에 들어가기 위한 꿀팁들
08:52
섹션 20. OUTRO
1 강
∙ 6분
수고하셨습니다
06:21
강의 게시일 : 2021년 01월 12일
(마지막 업데이트일 : 2023년 03월 01일)
수강평
총 135개
수강생분들이 직접 작성하신 수강평입니다.
4.8
135개의 수강평
5점
4점
3점
2점
1점
VIEW
추천 순
최신 순
높은 평점 순
낮은 평점 순
평점 순
높은 평점 순
낮은 평점 순
개발에 대한 지식이 부족한 사람에게는 모르는 용어 ,코드 등등이 자주 등장합니다.
이에대해 스스로 찾아보고 이해하면서 강의를 들어야해서 더 큰 공부가 되기는 하지만
조금 힘든 부분들도 존재했고 아직도 잘 모르는 부분이 존재합니다.
하지만 그런 부분은 차후 공부하여 해결할수 있고 이 강의를 통해서 성공적으로 프로젝트를 완성하였습니다.
우선 프로젝트를 완성하며 전반적인 큰 그림을 그리고 세부적으로 알아가는 공부방법도 굉장히 좋은 방법중에 하나라고 생각합니다 . 좋은강의 감사합니다
2021-06-27
1년차 프로덕트 디자이너 입니다. 원래는 HTML/CSS 정도만 다룰 수 있어서 실무 적용에 한계를 느끼고 있었습니다. 자바스크립트나 리액트쪽으로 넘어가면 무슨 말인지 이해가 하나도 안되어서 어려움을 느끼고 있었어요. 그랩님 머신러닝까지 강의 다 듣고나니 확실히 서비스가 어떻게 만들어지는지 큰 구조를 그릴 수 있게 되었어요.
얼마전에 개발자님이랑 커뮤니케이션할 일이 있었는데, 확실히 자바스크립트나 리액트, 서버쪽 개념을 이해하고 있으니까 소통이 정말 수월해졌다는 느낌을 받았어요. 정말 간단한 코드 수정 정도는 직접해서 개발자님한테 검토받기도 합니다.
가장 좋은점은 직접 코드를 쳐보면서 HTML/CSS 부터 머신러닝까지 전체를 훑을 수 있다는 점이에요. 그냥 이론적인 내용만 들으면서 아~ 이렇게 웹서비스가 만들어지는구나. 라고 머리로만 이해할텐데, 직접 코드 쳐보고 뚝딱뚝딱 만들면서 고민도하고 버그도 잡아보는 경험들을 해보니 확실히 전 보다 많이 성장한 느낌을 받았습니다. 좋은 강의 만들어주셔서 감사합니다.
2021-05-18
강사님이 참 친절하시고 아직 웹개발은 지식이 별로 없어서 뭘 어떻게 해야할지 참 막막했는데 덕분에 방향을 잡은 것 같습니다 제 개인적인 생각으로는 이 강의를 토대로 개발을 완전 처음 입문하시는 분이 이 정도로 코드를 구현하는 건 매우 힘든 일인 것 같아요. 다만, 자신이 어떻게 공부를 해야하고, 이 언어의 특징이 무엇인지, 웹 개발에는 어떤 언어가 쓰이는지 등등 처음에 큰 뼈대를 지을 수 있는 강의인 것 같아요! 좋은 강의 잘 듣고 갑니다! 저는 완강했지만 2번 정도는 처음부터 정독할 것 같아요!
2021-03-12
저는 아직 수강중인데 웹코딩 기초 잡기 좋은 강의에요!
HTML 기초부터 리액트, 서버, DB, 머신러닝까지 다양하게 한 번 경험해볼 수 있어서 좋아요.
특히, 잘 정리된 강의자료도 있어서, 강의 듣다가 이전 내용이 잘 생각나지 않으면
강의 다시 안 듣고, 자료 보면서 복습할 수 있어서 정말 좋았어요!
강의 우선 끝까지 듣고, 강의자료 찾아가며 저만의 웹사이트 실습해보면 도움이 많이 될 것 같아요.
그런데...
리액트 중반 이후부터는 강의내용에 비해 강의자료에 있는 설명이 부족한 느낌이에요.
특히, 리액트는 익숙하지 않아서 강의 듣고 복습하고 싶었는데,
그러기에는 강의자료에 쓰인 내용이 부족해서 강의를 계속 다시 듣느라
강의자료기 비교적 잘 갖춰져있는 이전 챕터들에 비해 공부하기 번거롭고 시간 소요도 많았어요ㅠㅠ
나중에 참고하며 직접 실습할 때도 불편할 것 같구요..
이제 전체 강의 중반쯤으로, Node, Express 듣고 있어서 이후 강의자료에 대해서는
아직 확인을 못했으나, 강의 중반 이후 강의자료 보강해주시면 정말 학습에 도움이 될 것 같습니다!!!! ㅠㅠㅠㅠㅠㅠ
2021-03-04
진행이 깔끔하고 몰랏던부분들도 체크하기 용이해여!!
2021-02-22
