영어를 조금 들을 줄 안다는 전제하에 소개하는 글임
참고로 내가 소개하는건 몇몇개 빼곤 다 '기초' 임
일단 기초부터 배우고, 쓰다보면 더 깊은 지식을 갈구할 때가 있을 것임
그땐 지금 배운걸 토대로 키워드로 검색해서 스스로 공부해야만 해.
자바스크립트 메소드는 mdn에 잘 나와있어.
한글 번역이 된 것도 있고 안된 것도 있는데 기초 method는 다 번역되어있으니 꼭 검색을 실생활 하길 바람!
예를들어 sort를 어케 쓰는지 잘 모르겠다?
구글에다 mdn sort 일케 치면 나와. korea를 덧붙이면 번역본이 젤 첫 검색결과로 뜸
만약 배열 method인데 내가 원하는 기능이 있는지 없는지 모르겠다?
아니면 있는건 아는데 이름이 기억이 안난다?
그럼 mdn array method나 그냥 mdn array로 검색해서 mdn페이지에서 주욱 내리면
method란이 있고 설명란이 있어. 그거 보면 됨
0.5. 웹 프로그래밍 튜토리얼(공짜, 한글)
https://poiemaweb.com/
프리 코드 캠프는 직접 코드를 짜는 칸이 있지만, 이건 아니야.
모던 자바스크립트 딥 다이브의 작성자가 만든 자습 문서야.
HTML, CSS, SASS, JS...의 핵심 개념이 한글로 깔끔하게 서술되어있어!
물런 이것부터 다 보고 넘어가라는건 아니야
너무 낯선 개념이라서 분명 하나도 재미없을 거거든
밑에거를 하다가 궁금한게 있을 때 한번씩 들러서 읽어보는 식으로 해봐. 분명 도움 될거야~
1. 프리 코드 캠프 (공짜)
https://www.freecodecamp.org/
기초부터 머신러닝, 알고리즘까지
(사실 가르친다기 보다는 자습 커리큘럼임. 그래서 보고 따라치기만 해도 어느정도 익숙해지는데 도움이 될거야)
여기서 했으면 하는것은
- Responsive Web Desgin : HTML, CSS
- JavaScript Algorithms and Data Structures
알고리즘의 Intermediate Algorithms 이전 까진 했으면 좋겠음.
알고리즘이 어렵긴하지만 기초 method에 익숙해지기 아주 좋아!
너무 어려우면 유튜브에 freecodecamp + 문제이름 으로 검색하면 풀이영상 많으니까 참고해.
2. udemy : 안젤라 쌤의 2021 웹개발 (최저가 1만1천원)
https://www.udemy.com/course/the-complete-web-development-bootcamp/
유데미는 매달 할인행사 하니까 그때를 노려
십몇만원일때 사면 절대 안된다!!!!
자막이 달려있어.
자동자막아니고 대본을 그대로 옮겨놓은 거라서
못듣겠으면 오른쪽에 대본 켜놓고 파파고로 복붙 해서 익히면 됨
그리고 아주아주아주!!! 친절하고 아주 자세하게 가르쳐줘서 진짜 좋아.
유데미에서 2강좌밖에 안들었지만 다른쌤은 안젤라쌤에 비해서..아주...🤯절레절레
html, css, javaScript, Reat, node.js랑 mongoDB까지..즉, 백엔드까지 가르치니까 적당히 걸러서 들으면 됨.
다 들어도 좋음. 난 다들었는데 너무 좋았어.. 백엔드가 너무 멀게만 느껴지지 않아서...좋더라고ㅋㅋㅋㅋㅋ
2.5. 리액트 프리코드캠프 (공짜)
https://www.youtube.com/watch?v=a_7Z7C_JCyo&list=PLsgtxV-evmBCgVQlSABpg7VKNld9YiWQF&index=24&t=15405s
개인적으로 선호하지 않는 목소리라서 안들었지만.. 중간에 리액트 코스 함 껴줘야할 것 같아서...🙄
사실 유데미에서 들었다는 리액트 강좌를 소개하는게 맞겠지만
너무 너무 어렵게 설명하고 약간 구식이라 중간 드랍했기때문에 그걸 추천해 줄 수 가 없다...
암튼 리액트는 리액트 공홈에서 도큐보는게 제일 최고임
너무 잘 설명이 되어있어서.. 한글화 다 되어있으니까 꼭 봐
3. 리액트(next.js : server side) 양재동 코드랩(공짜)
https://www.youtube.com/watch?v=yj5CTSX-iD0
그리고 여긴 진성 리액트는 아니고 next.js가르치는 영상인데..
난 왜 리액트라고 이름걸고 next 가르치나 짜증나서 보다가 중간드랍했지만...ㅠ ㅠ...
회사 스택에 next.js 있는 곳에 지원하려면 미리미리 next.js로 프로젝트도 만들고 하면 좋겠지?
리액트와 next.js 소개부터 다 처음부터 알려주니까 걱정말고 봐!
https://www.youtube.com/watch?v=9xzmAXbesaY&t=6s
리액트 네이티브인데 사실 리액트나 리액트네이티브나 언어측면에선 별반 차이없으니까(🙄....)
리액트 맛뵈기로 시간 남을 때 봐.
이쌤 목소리 차분하고 설명잘해서 귀에 쏙쏙 들어왔음
흔치 않은 퀄리티있는 한글 강좌...넘 좋구요?
이 유튜브 다 한글 강좌니까 입맛따라 들어봐!
3.4 리액트 지식이 어느정도 쌓였다면 벨로퍼트 (공짜)
https://react.vlpt.us/
한글 문서야
유료 동영상 강의에 곁들어서 나오는 도큐라서 설명이 좀 불친절해
근데 애초에 쌩초보자를 위한 도큐가 절대 아님
하지만 정말 알차고 너무 좋다... 진짜 최고
https://velog.io/@velopert
더욱 더 deep하고 알차고 머리가 어지러워질 정도의 내용을 원한다면
이블로그를 참고해
(절대 초보자용 / 입문자용 아님)
3.9. 인프런 존안 쌤(공짜) mern 스택 (풀스택)
https://www.inflearn.com/users/@johnahn/courses
이분은 프로젝트 한두개만들다가 mern스택 하고싶을때 들음 좋음.
무료강의도 충분히 엄청 좋으니까 그걸로 한두개 기미해봐
심지어 유료강의도 저렴하다. 퀄리티도 엄청 좋은데!!
솔직히 말해서 한글프리미엄으로
별것도 아닌걸로(유튜브에서 영어로 검색하면 공짜로 다 나오거나 영어강의도 싼거많은데)
유료 엄청 비싸게 때리는 강의 싫어하는데
이분 강의는 퀄리티도 좋고 가격도 진짜 딱 저렴한 편이라서 좋아함!
난 무료밖에 안들었지만 ㅋㅋㅋ;;
나중에 유료강의도 들을 계획임!
추천 코스는 (사실 무조건 이렇게 들어야함!)
1) 따라하며 배우는 노드, 리액트 시리즈 -기본강의
2) 따라하며 배우는 노드, 리액트 시리즈 -유튜브 사이트 만들기
이건 절대 바로 듣지마..기초라고 하는데 절대 쌩기초 아님
어느정도 리액트 지식이 있어야 이해가능해.
취업하고 나서 들어도 무방할 듯!
이건 어짜피 풀스택이니까!!
4. 취업하려면 코테 통과해야쥬? 알고리즘 강의 듣자 (공짜)
프리코드캠프에서 알고리즘 공부 하긴했지만 이쯤되면 코딩의 신 아니면 다 까먹었을거야
다시 알고리즘에 익숙해지기 위해 뇌를 말랑말랑하게 해보자
https://www.notion.so/JS-100-94d97d294dd14c9b911a02c840fa9f2d
기초 알고리즘100제
진짜 기초임 이걸로 통과할 생각은 하지말 것..
프리코드캠프 풀다가 이거 풀면 진짜 쉽다는걸 느낄거야
하지만 프리코드캠프는 영어고 이건 한글이잖아
뇌를 아주 말랑말랑하게 할 수 있다는데 의의를 두자
해설 강의는 인프런에 있어. (유료)
하지만 문제지와 정답은 무료임.
이거 하고나서 백준 알고리즘 문제 풀던가 하면 좋을거얌
백준 풀기엔 겁난다 싶으면
https://www.inflearn.com/pages/prepare-coding-test
인프런에서 제공하는 코딩테스트 로드맵..(유료)
이후는 나도 취업안해봐서 몰라 ^^...
알고리즘 공부하다가 딴짓하고싶어서 적는 중임 ㅎㅎ...ㅎㅎㅎㅎㅎㅎ
다들 화이팅! 🙆♀️🙆♀️🙆♀️
추가 유튜버들
- 드림코딩 엘리 https://www.youtube.com/channel/UC_4u-bXaba7yrRz_6x6kb_w
-- 친절하고 조근조근 정말 잘가르침. 가르치는데 진심임. (이렇게까지 퀄리티 있는 한국유튜버는 정말 유일해...)
-- 개념공부할 때 좋음
- 노마드코더
-- 솔직히 그렇게까지 추천하지 않음. 번역이 불성실하고(;;) 너무 앞서나가서 설명하는 느낌?
-- 게다가 비쌈 !! 하지만 무료강의가 있으니 기미 가능.
-- 좋다는 사람은 많긴 함
- Online Tutorials
-- 스타일링 위주. 취신 트렌드 많아서 가끔 봄
-- 영언데 영어가 아님.. 왜냐면 코드만 침 ㅋㅋㅋㅋ 말안함 ㅋㅋㅋ 근데 코드 설명을 코드로해서 이해가 됨 ㅋㅋㅋ
-- https://www.youtube.com/channel/UCbwXnUipZsLfUckBPsC7Jog
- Dev Ed
-- https://www.youtube.com/playlist?list=PLDyQo7g0_nsVHmyZZpVJyFn5ojlboVEhE
-- 인사말이 사람 기분 좋게해서 집중 좀 잘 됨. 딱 기초 ~ 중간 정도
- web dev simplified
https://www.youtube.com/watch?v=hQAHSlTtcmY
잘생겨서 집중안됨 🙄
그리고 너무 너무 목소리가 차분해서 집중안됨
이강의는 안들어봤지만 다른강의 들었을 때...
좀 잘 가르치는듯? 영어 잘하면 이사람거 쭉쭉 들어도 상관없을듯!
위의영상은 좀 별로인데 밑의영상은 도입부부터 잘생김...😉.... 이왕이면 잘생긴사람 보는게 좋잖아 핳하
아마 영어 듣는 귀도 뚫릴거야
https://www.youtube.com/watch?v=fW3IRO4oi9Y
- 추가 정보
아래는 중급~심화를 위한 책이야.
자바스크립트는 코뿔소 책이나 '모던 자바스크립트 deep dive' 책 추천
리액트는 '리액트를 다루는 기술'
파이어폭스에서 제공하는 web개발학습하기 (mdn)
https://developer.mozilla.org/ko/docs/Learn
그냥 이런게 있다는 정도로 한번 훑어봐. 마음에 들 수도있고 아닐 수도 있고..?🤔
- 아주 작은 팁
크롬으로 css확인하는것보다 파이어폭스로 css확인하는게 더 편함.
css 직접 수정해서 확인한뒤에 그 코드 복붙 하는게 최고야
게다가 grid system까지 볼 수 있고(이거진짜 최고)
일일이 border: 1px solid red; 이런거 쳐서 영역 어디인지 확인할 필요 없이
기본기능으로 제공해준다...
다들 크롬쓰고있었다면 파폭으로 갈아타렴..
로그인 해주세요.