성장의 계절, 모든 강의 30% 할인!

Thumbnail
진짜 시작, 봄맞이 30% 할인 중(D-8)
BEST
개발 · 프로그래밍 풀스택

비전공자를 위한 진짜 입문 올인원 개발 부트캠프 대시보드

(4.8)
140개의 수강평 ∙  2,956명의 수강생
30% 143,000원 100,100원

월 20,020원

5개월 할부 시
지식공유자: 그랩
총 118개 수업 (19시간 31분)
수강기한: 
무제한
수료증: 발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

입문자를 위해 준비한
[웹 개발] 강의입니다.

왕초보도 할 수 있는 웹, 서버, 모바일 앱, 머신러닝까지 익히는 끝판왕 풀스택 강의!! 개발을 어디서부터 시작할지 막막했다면 이 강의를 강력 추천할게요. Javascript 하나로 진행합니다!

✍️
이런 걸
배워요!
HTML, CSS, JS 기본
웹 개발 (React)
모바일 앱 개발 (React Native)
서버 개발 (Node.js)
머신러닝 개발 (Tensorflow js)
Git
클라우드
필수 개발 지식

쉽고 다양하게 활용되는 Javascript 로 공부해요!

Javascript(자바스크립트)는 을 시작으로 서버, 모바일, 머신러닝, 블록체인 등 다양한 분야에서 사용되는 프로그래밍 언어예요.
상대적으로 쉬운 난이도로 입문자가 배우기에 적합하고 모든 분야에서 활용될 수 있어요!!

 

 

이런 걸 만들 거예요👀

상품을 사고 팔 수 있는 '그랩마켓' 서비스를 단계별로 구축합니다.


 

 

 

궁금해요 🙋‍♂️🙋‍♀️

Q. 이 강의에서 무엇을 배울 수 있나요?

프론트엔드

      1. HTML, CSS, FlexBox
      2. Javascript, ES6
      3. React 라이브러리
      4. Antd, React-Router 라이브러리
      5. Postman
      6. 반응형 웹 등

백엔드

      1. Node.js
      2. Express 프레임워크
      3. Sqlite 데이터베이스 + Sequelize ORM
      4. 이미지 파일 처리(multer)
      5. 클라우드(Vercel, Heroku)
      6. 상품 추천 API

머신러닝

      1. Tensorflow.js
      2. 머신러닝, 딥러닝 메카니즘
      3. Mobilenet

모바일 앱

      1. React Native
      2. Expo
      3. React Navigation
      4. 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분의 수업
이 강의는 영상, 수업 노트, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 1. --- Stage 1 ----
프로그래밍이 익숙해지는 환경 만들기
섹션 2. HTML & CSS 기본
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 기본
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 서버 통신
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)
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 ----
섹션 7. 웹 개발하기 (React)
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)
Git & Github 개요 04:01
[그랩마켓] Git Commit 적용하기 09:15
[그랩마켓] Github에 소스코드 업로드하기 06:07
섹션 9. 웹 라이브러리 (React-router-dom, Antd)
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)
API 개요 06:51
URL 구조 이해하기 08:50
간단 Node 서버 구축하기 13:07
그랩 마켓 서버 구축하기 06:08
Express 프레임워크 사용하기 10:37
그랩마켓 웹과 상품 정보 연동하기 04:06
Express에서 데이터 처리하기 11:42
섹션 11. 서버에 데이터베이스 연동하기
데이터베이스 개요 07:36
Sequelize, Sqlite 설치하기 16:20
상품 생성, 조회 API 구현 10:44
상품 상세 조회 API 추가 09:33
웹과 API 연동하기 & dayjs로 날짜 다루기 12:54
섹션 12. 서버 파일 처리 (multer) & 그랩 마켓 구현 완료
파일 처리 개요 05:03
multer 적용하기 11:34
상품 업로드 기능 구현 - 1 13:44
상품 업로드 기능 구현 - 2 11:07
그랩마켓 최종 구현 16:41
REST API란? 06:10
섹션 13. 그랩 마켓 발전시키기
슬라이딩 배너 구현 16:24
결제하기 구현 - 1 09:12
결제하기 구현 - 2 17:20
반응형 웹 14:53
섹션 14. 클라우드 (Heroku, Vercel)
클라우드 개요 06:54
Fly.io 에 그랩마켓 서버 배포하기 08:15
Vercel에 그랩마켓 웹 배포하기 11:36
섹션 15. 모바일 앱 개발하기 (React Native, Expo)
React Native 개요 06:36
Expo 설치하기 11:11
Android Studio 설치 03:02
Xcode 설치 (only 맥 유저) 03:10
React Native와 React의 차이점 11:36
섹션 16. 모바일 앱 개발하기2
메인 화면 구현 - 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)
머신러닝&딥러닝 개요 05:06
딥러닝 메카니즘 이해하기 06:31
tensorflow js로 머신러닝 모델 구현하기 12:54
섹션 18. 그랩 마켓에 머신러닝 적용하기 (Mobilenet)
상품 분류 로직 구현하기 14:08
상품 업로드 API에 분류 로직 연동하기 12:31
상품 추천 API 구현하기 09:55
웹에 추천 기능 연동하기 17:01
모바일 앱에 추천 기능 연동하기 16:10
섹션 19. 개발자로 나아가기
프론트엔드 개발자 19:22
백엔드 개발자 21:58
빠르게 학습하는 방법 10:14
좋은 회사에 들어가기 위한 꿀팁들 08:52
섹션 20. OUTRO
수고하셨습니다 06:21
강의 게시일 : 2021년 01월 12일 (마지막 업데이트일 : 2023년 03월 01일)
수강평 총 140개
수강생분들이 직접 작성하신 수강평입니다.
4.8
140개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
akdlswjf2 thumbnail
5
강사님이 참 친절하시고 아직 웹개발은 지식이 별로 없어서 뭘 어떻게 해야할지 참 막막했는데 덕분에 방향을 잡은 것 같습니다 제 개인적인 생각으로는 이 강의를 토대로 개발을 완전 처음 입문하시는 분이 이 정도로 코드를 구현하는 건 매우 힘든 일인 것 같아요. 다만, 자신이 어떻게 공부를 해야하고, 이 언어의 특징이 무엇인지, 웹 개발에는 어떤 언어가 쓰이는지 등등 처음에 큰 뼈대를 지을 수 있는 강의인 것 같아요! 좋은 강의 잘 듣고 갑니다! 저는 완강했지만 2번 정도는 처음부터 정독할 것 같아요!
2021-03-12
지식공유자 그랩
많은 강의를 소화하시느라 고생하셨습니다👍🏼 정말 열심히 수강하시던 분이라 기억에 남네요! 적어주신 대로 본 강의는 한 번 볼 때와 두 번 볼 때 느낌이 다를 거예요. 수강하시면서 모르는 부분들이 있다면 언제든 편하게 댓글 남겨주세요!
2021-03-12
SKT_Mong thumbnail
4
개발에 대한 지식이 부족한 사람에게는 모르는 용어 ,코드 등등이 자주 등장합니다. 이에대해 스스로 찾아보고 이해하면서 강의를 들어야해서 더 큰 공부가 되기는 하지만 조금 힘든 부분들도 존재했고 아직도 잘 모르는 부분이 존재합니다. 하지만 그런 부분은 차후 공부하여 해결할수 있고 이 강의를 통해서 성공적으로 프로젝트를 완성하였습니다. 우선 프로젝트를 완성하며 전반적인 큰 그림을 그리고 세부적으로 알아가는 공부방법도 굉장히 좋은 방법중에 하나라고 생각합니다 . 좋은강의 감사합니다
2021-06-27
지식공유자 그랩
꼼꼼한 피드백 감사합니다! 시간이 나는대로 더 꼼꼼한 설명 자료도 보강해야겠습니다!
2021-07-14
JB .D thumbnail
5
진행이 깔끔하고 몰랏던부분들도 체크하기 용이해여!!
2021-02-22
지식공유자 그랩
감사합니다 JB.D 님😁 멋진 개발자가 되시길 응원하겠습니다!
2021-02-23
욱이 thumbnail
5
1년차 프로덕트 디자이너 입니다. 원래는 HTML/CSS 정도만 다룰 수 있어서 실무 적용에 한계를 느끼고 있었습니다. 자바스크립트나 리액트쪽으로 넘어가면 무슨 말인지 이해가 하나도 안되어서 어려움을 느끼고 있었어요. 그랩님 머신러닝까지 강의 다 듣고나니 확실히 서비스가 어떻게 만들어지는지 큰 구조를 그릴 수 있게 되었어요. 얼마전에 개발자님이랑 커뮤니케이션할 일이 있었는데, 확실히 자바스크립트나 리액트, 서버쪽 개념을 이해하고 있으니까 소통이 정말 수월해졌다는 느낌을 받았어요. 정말 간단한 코드 수정 정도는 직접해서 개발자님한테 검토받기도 합니다. 가장 좋은점은 직접 코드를 쳐보면서 HTML/CSS 부터 머신러닝까지 전체를 훑을 수 있다는 점이에요. 그냥 이론적인 내용만 들으면서 아~ 이렇게 웹서비스가 만들어지는구나. 라고 머리로만 이해할텐데, 직접 코드 쳐보고 뚝딱뚝딱 만들면서 고민도하고 버그도 잡아보는 경험들을 해보니 확실히 전 보다 많이 성장한 느낌을 받았습니다. 좋은 강의 만들어주셔서 감사합니다.
2021-05-18
지식공유자 그랩
꼼꼼한 리뷰 감사드립니다 욱이님 :) 공부하시면서 또 모르시는 부분들 있으면 언제든 편하게 질문 남겨주세요! 빠르게 확인하고 답변드리도록 할게요! 앞으로 멋진 성장 기대하겠습니다😁
2021-07-14
xiao_d thumbnail
5
저는 아직 수강중인데 웹코딩 기초 잡기 좋은 강의에요! HTML 기초부터 리액트, 서버, DB, 머신러닝까지 다양하게 한 번 경험해볼 수 있어서 좋아요. 특히, 잘 정리된 강의자료도 있어서, 강의 듣다가 이전 내용이 잘 생각나지 않으면 강의 다시 안 듣고, 자료 보면서 복습할 수 있어서 정말 좋았어요! 강의 우선 끝까지 듣고, 강의자료 찾아가며 저만의 웹사이트 실습해보면 도움이 많이 될 것 같아요. 그런데... 리액트 중반 이후부터는 강의내용에 비해 강의자료에 있는 설명이 부족한 느낌이에요. 특히, 리액트는 익숙하지 않아서 강의 듣고 복습하고 싶었는데, 그러기에는 강의자료에 쓰인 내용이 부족해서 강의를 계속 다시 듣느라 강의자료기 비교적 잘 갖춰져있는 이전 챕터들에 비해 공부하기 번거롭고 시간 소요도 많았어요ㅠㅠ 나중에 참고하며 직접 실습할 때도 불편할 것 같구요.. 이제 전체 강의 중반쯤으로, Node, Express 듣고 있어서 이후 강의자료에 대해서는 아직 확인을 못했으나, 강의 중반 이후 강의자료 보강해주시면 정말 학습에 도움이 될 것 같습니다!!!! ㅠㅠㅠㅠㅠㅠ
2021-03-04
지식공유자 그랩
안녕하세요 xiao_d님! 말씀하신 대로 react 중반 부분부터 서버 부분까지 강의 자료는 업데이트할 계획을 가지고 있습니다. 업데이트가 되면 추가로 공지 올려드릴게요😁 좋은 피드백 감사합니다!
2021-03-12
연관 로드맵
이 강의가 포함된 잘 짜여진 로드맵을 따라 학습해 보세요!