📚 기술 블로그 / 사이트
📚 HTML 공부
- 생활코딩 - WEB1- HTML & Internet✔️
➡️ Classic is the best 명불허전 개발을 시작하는 사람들이 첫번째로 봐야 할 강의!
개발 공부를 처음 시작하는 사람들에게 어떻게 개발 공부를 접근해야하는지 마인드 셋을 길러주는 강의! - 초보자를 위한 HTML & CSS 동작과 원리
- 드림코딩 - HTML
- ZeroChoTV - HTML/CSS 무료 강좌(네이버 메인)
- 드림코딩 - HTML 태그들, 헷갈리는거 정리해 보았다 🥳 (시맨틱 태그, 중요한 태그들 모음)
- 개발자의 품격 - 사람을 알면 HTML이 보인다!
- 개발자의 품격 - HTML 제대로 배워 볼래?
- 개발자의 품격 - Details vs Collapse
- 개발자의 품격 - Datalist vs Select
- 개발자의 품격 - HTML5 Geolocation을 이용해서 사용자 위치에서 거리순으로 목적지 정렬하기
📚 CSS 공부
- 생활코딩 WEB2-CSS✔️
- 빔캠프 - 코딩가나다|CSS
- 빔캠프 - O A C S S|아리까리한 CSS의 갈증해소 프로젝트
- 드림코딩 - CSS
- 반드시 기억해야 하는 CSS 선택자 30개
- 개발자의 품격 - 반응형웹을 만드는 기술 CSS 미디어쿼리(Media Query) 이해하기
- 유코딩 - [클론코딩]쇼핑몰 상품주문영역 HTML&CSS
- Sass(SCSS) 완전 정복!
- 1분코딩
📚 CSS 참고 사이트
- 리액트 컴포넌트 스타일링하기
- CSS Triggers
- https://tailwindcss.com/
- CSS 임시방편(본격적으로 꾸미기 전에 잠깐 적용해두는 CSS):
https://andybrewer.github.io/mvp/ - 색 조합 추천: https://mycolor.space//
- 패턴 배경
https://www.toptal.com/designers/subtlepatterns/
https://coolbackgrounds.io// - 모양 배경: https://www.shapedivider.app//
- svg Generator
- 색상 추출, 색상 휠: https://color.adobe.com/ko/create/color-wheel
- 그라데이션: https://cssgradient.io/ & https://uigradients.com/#Subu
- 브랜드 icons: https://www.shapedivider.app//
- shadow example
- CSS 아이디어: https://dribbble.com/ & 코드펜
- Public APIs: https://github.com/public-apis/public-apis
- fontawesome: 다양한 ICON을 가져올 수 잇는 사이트
- flatuicolors: 다양한 색들을 가져오기 편한 사이트
📚 Javascript 공부
- 생활코딩 WEB2-JavaScript
- ZeroChoTV - ES2021 자바스크립트 강좌
- 드림코딩 - 자바스크립트 기초 강의
- ZeroChoTV - 인간 JS 엔진 되기 (JS 고급 강좌)
- 벨로퍼트와 함께하는 모던 자바스크립트
- 코드스피츠 - 객체지향 자바스크립트
- 개발자의 품격 - 프론트엔드
- 코딩알려주는누나 - 자바스크립트 강의
- 실용주의 프론트엔드 개발
- 노마드 코더 - 33 Concepts of Javascript
- 조코딩 - API란? 개념 및 유용한 API들 소개, 날씨 API 자바스크립트 실전 활용 방법
- Rock's Easyweb - 코딩은 처음이라 with 웹 퍼블리싱
- 프롱트 - 자바스크립트
- 프로그래머스 - 자바스크립트와 웹 프론트엔드
- 유코딩 - [클론코딩]쿠팡로그인 클론코딩 JS까지!
- 노마드 코더 - 바닐라 JS로 크롬 앱 만들기
- [VanillaJS Project]인스타그램 클론코딩
- [Vanilla JS] 자라나는 나무 만들기 - 1
- DOM은 뭐고 가상 DOM은 뭔가요? (+ Svelte와 React의 차이)
- 초보자를 위한 40가지의 자바스크립트 프로젝트
- vanillaJS 스몰 프로젝트
- 코딩앙마 - Jest
📚 Typescript 공부
📚 React 공부
- ZeroChoTV - 리액트 무료 강좌(웹게임)
- [토크ON세미나] 프론트엔드 개발환경 이해
- 코딩앙마 - React js
- 코딩앙마 - React Testing Library
- 코딩애플 - 리액트
- 개발자의 품격 - 한시간 만에 끝내는 React.js 입문
- 조코딩 - 앱 개발 이렇게 쉬웠나? React Native로 크로스 플랫폼 웹뷰앱 만들기
- 노마드 코더 - ReactJS로 영화 웹 서비스 만들기
- velopert - React & Express 를 이용한 웹 어플리케이션 개발하기
- velopert - 리액트의 Hooks 완벽 정복하기
- React에서 상태관리하기 (feat. Context API, Redux, React Query)
- 남들이 사용해서 Redux 인가, 필요에 의해 쓰는 Redux 인가.
- 노마드 코더 - 초보자를 위한 리덕스 101
📚 Next.js 공부
📚 Node.js 공부
📚 Vue.js 공부
- 개발자의 품격 - 4시간만에 완벽하게 끝내는 Vue.js 입문 | Vue.js 3.x 최신버전
- ZeroChoTV - Vue 무료 강좌(웹게임)
- 코딩애플 - Vue 로 만드는 직방 / 인스타그램 웹앱
📚 GraphQL 공부
- 노마드 코더 - 이 영상을 보고나면 REST API 를 못쓰게 됩니다.
- 얄코 - 얄팍한 GraphQL과 Apollo
- 노마드 코더 - GraphQL로 영화 API 만들기
- 노마드 코더 - GraphQL로 영화 웹 앱 만들기
📚 웹 공부
📚 CS / IT 지식
- 모두를 위한 컴퓨터 과학 (CS50 2019)
- Tech Interview for developer - 신입 개발자 전공 지식 & 기술 면접 백과사전
- 취준생이 반드시 알아야 할 프론트엔드 지식들
- [IT 개발자와 일할 때 필요한 모든 개발지식] A to Z 자료 모음집 By 그랩
- Front-End Checklist
- 드림코딩 - 개발자라면 누구나 알고 있으면 좋은 지식
- 큰돌의터전 - 개발자필수IT지식
- Technical Note
- 라매개발자 - 강의
- naver d2 - 브라우저는 어떻게 동작하는가?
- naver d2 - 함수형 프로그래밍과 ES6+
- 삼성 SDS - 웹 프론트엔드 프레임워크, 무엇을 쓸까?
- 프론트엔드 웹애플리케이션 아키텍쳐 비교분석 : MVC와 MVVM
- FrontEnd Application에서 Null 다루기
- 노마드 코더 - 함수형.객체형 프로그래밍
- 노마드 코더 - 라이브러리? 프레임워크? 차이점 아직도 모름? 5분 순삭.
- 기술노트 with 알렉 - 기술공부
- 얄팍한 코딩사전 - 반응형 프로그래밍이 뭔가요?(+ReactX 강좌)
- 우아한테크코스 - 테코톡
- 드림코딩 - IT 트렌드
- 개발자의 품격 - 프론트엔드 개발자가 꼭 알아야 하는 가짜 서버(json-server) 사용하기
- Taehoon - Programming Tips
- 노마드 코더 - IT 5분 잡학사전
- 프롱트 - 프론트엔드
- 데이터 유치원 - 비개발자를 위한 IT 용어 가이드
- 프론트엔드 백엔드란 무엇인가? | 클라이언트 서버란 무엇인가? | 초보자를 위한 쉬운 개념 정리!
- 개발자의 품격 - 카카오계정으로 로그인하기 (카카오톡 로그인 API 사용하기)
- 개발자의 품격 - 글로벌 서비스 필수 기능 - 타임존(Timezone) 처리
- 카카오페이지 글로벌 웹 개발 후기
📚 알고리즘(코딩테스트) / 데이터 구조
- PS를 공부하는 뉴비들을 위한 안내서
- 제주코딩베이스캠프 - JavaScript 알고리즘 100일 챌린지
- 바킹독 - 알고리즘
- 노마드 코더 - 알고리즘, 데이터 구조
- 쉬운코드 - 알고리즘
- 쉬운코드 - 데이터 구조
- 쉬운코드 - 컴퓨터 구조
- 혼자 공부하는 컴퓨터 구조+운영체제
- 대기업 IT직군 코딩테스트 합격을 위한 현실적이고 직관적인 공부 순서
- 자바스크립트 코딩 테스트에서 가장 많이하는 실수들
- LINE 신입 SW 개발자 코딩 테스트, 이렇게 만들어졌습니다
📚 운영 체제
📚 데이터 베이스
📚 깃, 깃허브
- 초등학생에게 Git을 설명해본다면? (Git 1편)
- 초등학생에게 Git branch와 merge를 설명해본다면? (Git 2편)
- 드림코딩 - 깃, 깃허브
- ZeroChoTV - 12가지 명령어로 배우는 Git
- Github Readme 꾸미기 총정리
📚 디자인 패턴/시스템
📚 실습
- 부스트코스 - 웹 프로그래밍 풀스택 강의
- Interactive Developer - Creative Coding
- 개발자의 품격 - 제품 판매 웹앱 구현
- 조코딩 - 웹개발 이렇게 쉬웠나? 웹사이트 7분만에 개발하고 실전 배포하기
- 개발자의 품격 - 한시간만에 홈페이지 개발하기 입문
📚 FE/개발 전반
- 드림코딩 - 프론트엔드 공부 순서, 높은 연봉 받는 프론트엔드 개발자 되기 | 해외 개발자 선배가 알려드려요 (웹개발 공부 순서)✔️
- 드림코딩 - 코딩을 빨리 배우는 법 (온라인 강의로 배울때 200% 효과적으로 배우기)✔️
- 30대 초반 비전공자의 고민 - 늦은 나이, 개발자로 시작해도 좋을까요
- [번역] 30살에 주니어 개발자가 된다는 것 (Being a Junior Developer at 30)
- 32살에 개발에 입문한 비전공자가 인프런 창업한 이야기 [슬라이드]
- ZUM인터넷 신입사원의 파일럿 프로젝트 후기 - TV줌 CMS
- 초보 개발자에게 권장하는 객체지향 모델링 공부 방법
- 신입사원을 위한 웹서비스 확장 전략 [슬라이드]
- 신입개발자 생활백서 [슬라이드]
- 초보개발자가 알아야 할 5가지 핵심 가치 [영문]
- 테알못 신입은 어떻게 테스트를 시작했을까? [슬라이드]
- 웹개발자 기준 비전공자 신입으로서 전공자한테 안 밀리고 살아남는 법
- 우아한형제들 신입개발자 파일럿 프로젝트 회고
- 신입 프론트엔드 개발자가 되려면 무엇을 학습해야 하나요?
- 3개월 차 주니어가 느끼는 나와 시니어의 차이
- 개발자 직군 파헤치기 [번역]
- 어떤 주니어 개발자의 이야기
- 현직 우버 개발자가 느낀 신입 개발자들이 제일 많이 하는 실수 3가지
- 문과생의 카카오 개발자 이직기
- 병아리 개발자의 걸음마 한 발짝 (feat. 파일럿 프로젝트)
- 비전공 개발자가 전공자보다 정말 불리할까?
- 스포카에서 신입 개발자가 적응하는 법: 부트캠프 후기
- 초보 웹 개발자를 위하여
- 웹 프론트엔드 개발자, 어떻게 준비해야 할까?
- 2020 FrontEnd 개발자가 되기 위한 10가지 방법
- 비전공자 웹개발자로서 살아남는 법 정리본(출처:okky)
- 개발자를 꿈꾸는 취업 준비생에게
- 주니어 프론트엔드 개발자의 채용 프로세스 참여 후기
- 경력보다 실력에 자신있는, 토스팀 개발자를 만나다
- 갓 인턴 생활을 마친 카카오 개발자들과의 대화
- LINE 서버 개발자가 되기까지 내가 준비한 것들
- 한달차 신입 개발자의 업무 적응기
- 주니어 개발자를 위한 논어(論語)
- 초보 개발자, 이것만 안 해도 평균 이상 갑니다 (흔히 하는 실수 공개)
- 신입 개발자였던 내게 해주고싶은 조언들
- 박문수 이야기
- 개발을 잘 하는 습관
- 개발자가 되고픈 어린 친구들에게...
- 프론트엔드 신입 개발자 역량에 대한 생각
- 30년 개발자의 ‘개발자로 성공하기 위한 5가지 노하우
- N명의 개발자, N개의 조언 [슬라이드]
- 지방대 개발 비전공자가 배달의민족 리드 개발자가 되기까지 [영상]
- 질문을 잘하는 개발자
- [회고] 소주 1병 조지고 쓴 1년차 개발자의 아찔했던 순간들
- [개발] 주니어 개발자가 공부하는 방법
- 정산지기를 향한 첫걸음 (feat. 파일럿 프로젝트)
- 팀 문화의 탄생
- 코딩애플 - 2023 '모던' 웹개발자 하려면 배울 것들
- 프로그래밍 공부 방법
- 프론트엔드 개발, 뭐하는 직종이야?
- 웹 프론트엔드 개발자 아무것도 모르는 상태에서 취업까지 하는 구체적인 준비방법
- 내 업의 본질은 무엇인가?
- 후배 개발자에게 - 2019년
- 프런트엔드 개발자 학습 방향
- 우아한 테크코스 by 박재성
- 드림코딩 - 개발 공부 방법
- 라매개발자 - 웹 프론트엔드 개발자 아무것도 모르는 상태에서 취업까지 하는 구체적인 준비방법 | 프론트엔드 공부순서 | 취업준비 | 면접준비
- 라매개발자 - 프론트엔드 취업
- 김버그 Kimbug - 프린이 로드맵 ROADMAP
- 조코딩 - 요즘 코딩이 진짜 John나 쉬운 이유
- 조코딩 - 코딩 분야 소개와 가장 먼저 공부해야 할 것과 공부 순서
- 💻 당신의 사이드 프로젝트를 위한 10가지 팁
- 개발자의 품격 - 잡스러운 수다
- 누구나 원하는 개발자되기
- 개발자를 구하는 스타트업 창업가 유형
- 개발자의 평생공부
- 개발자의 성장 가능성은 어떻게 측정 가능한가?
- 노마드 코더 - 개발을 시작한 당신에게 해주고 싶은 이야기
- 성장의 조건
- 개발자들이 개발쪽으로 가려고 하는 비전공자들한테 가지 말라고 하는 이유
- FE로 취업하기 전에 알았으면 좋았을 것들
- 라매개발자 - 프론트엔드 취업
- 가이드: 효과적인 온라인 질문법
- 함께 일하고 싶은 사람 - 1. 업무 습관
- 개발자의 삶 - SI 개발자란
- CodeReview에대해
- 프로덕트 스펙 문서 작성법
- 당신의 클론 코딩은 왜 실패하는가?
- [번역] 좋은 코딩을 위한 13 가지 간단한 규칙
- 아마존 3년 출근기 #1 – 하루 일과 및 요약
- 일일커밋의 효용성
- 넷플릭스의 문화 : 자유와 책임 (한국어 번역본)
- 소프트웨어 개발자 되기는 왜 어려운가?
- 문제를 해결할 때 사고가 중요한 이유
- 솔직한 피드백으로 좋은 팀워크를 만들 수 있을까? - 파워풀을 읽고
- 2년차 서버 개발자가 바라본 LINE의 개발 문화
- 10년간 슈퍼셀을 경영하며 배운 10가지 교훈
- 개발자 지망생을 위한 주관적 추천도서
- 개발자가 실력을 향상시킬 방법은 ○○뿐이에요_우아한형제들 김민태의 이야기
- 10배 뛰어난 개발자 되기
- 회사 밖에서 성장하기
- 내 마음대로 선정한 개발자/프로그래머 추천도서(필독서) 50선
- 현역 70세 개발자 이상길님께 '개발자의 길'을 묻다!
- 프로그래머로 살아남기 위해 필요한 언어 둘
- 개발자는 어떻게 성장해야 할까?
- 40대 개발자의 독일 회사 취업기 (1)
- 30년차 개발자 장동수가 말하는 좋은 개발자
- 개발자가 블로그를 운영해야 할 이유
- 좋은 개발자 / 유명한 개발자
- 프로그래머로서의 성장을 도왔던 태도들
- 좋은 기술 블로그를 만들어 나가기 위한 8가지 제언
- 이동욱 배달의민족 개발자 “개발자는 문제 해결사, 재능이 전부가 아니다”
- 개발자의 글쓰기 - 소프트웨어 엔지니어를 위한 테크니컬 라이팅
- 프로그래머는 몇 살까지 할 수 있나
- 괜찮은 웹 프론트 개발자
- 흔하지 않고 좋은 웹 개발자가 되는 방법
- 개발을잘하고싶어요-네이버랩스 송기선님
- 내게 실용적이었던 프로그래밍 공부 방법들
- 야놀자를 떠나며... (feat. 레저큐)
- 평범한 개발자 그 이상이 되기 위한 야생 학습 비결
- 개발하기 바쁜데 글까지 쓰라고? (글쓰는 개발자가 되자.)
- 나는 어떻게 공부했는가? - 성장하는 개발자를 위한 팁
- 프로그래머를 지탱하는 3가지 성분
- [번역] 개발 배우기가 정말 어려운 이유
- 마켓컬리 소프트웨어 엔지니어 "이종립" 인터뷰
- IT기자, 개발자로 돌아오다…CODEF 합류 10개월 후기
- 개발자와 명상
- 개발자의 글쓰기, 기술 블로그에 대하여
- 번외 — 개발자가 알아두면 좋은 영어 표현들 및 발음 실수들
- 카카오 서버 개발 인턴 robin의 성장기
- 그런 개발자로 괜찮은가 - '자기계발' 편
- SI회사에 입사하기 전 읽으면 좋은 글 - SI의 단점
- 아틀라시안 취업후기
- 스타트업 취업의 고수가 되는 방법
- 제로 스펙에 가까웠던 듣보잡 개발자의 유명 IT 기업 도전기 - 참석 후기 ✔️
- [번역] 코딩 공부 후 3개월 간 구직하며 배운 점
- 비전공 신입 개발자로 입사하기
- 줌터뷰와 함께한 인터뷰 - 인문학도 개발자되다 저자
📚 컨퍼런스
- 컨퍼런스 정보 알림
- FEConf 2022 A Track
- FEConf 2022 B Track
- if(kakao)dev2022
- Naver D2 - TECH CONCERT: FRONT END 2019
- NAVER TECH CONCERT 2020
📚 기술 인터뷰 준비
- 쩜튜브 - 정주행 하기
- Brave Tech Interview
- Interview_Question_for_Beginner
- 프론트엔드 개발자 면접 정리
- READY FOR TECH INTERVIEW
- tech-interview-for-developer
- prepare_frontend_interview - FE 면접 핸드북
- Front End Interview Handbook
- Tech Interview
- 신입 개발자 기술면접
- 기술면접 준비하기
- 프론트엔드 기술면접 실제 현업 질문 모음
- 프론트엔드 개발자 면접 질문(기술면접) 정리
- 프론트엔드 면접 질문 모음
- 프론트엔드 개발자 인터뷰 후기 (면접 질문 정리)
- [번역] 개발자를 위한 면접 지침
- 프론트엔드 면접 문제 은행
- 프론트엔드 면접 문제 은행 질문 답변
- 신입 개발자 면접 질문 시리즈
- 당신의 브라우저 주소창에 google.com을 치고 엔터를 누르면 어떤 일이 생길까요?
- 큰돌의터전 - 프론트엔드 면접전 보고가자
- 신입 개발자 면접 준비 (1) : 일반 면접 관련 예상 질문(개발 외)
- 신입 개발자 면접 준비 (2) : 기술면접
- 코딩애플 - 데이터 정규화가 뭔지 설명해보세요 (개발면접타임)
- 코딩애플 - index가 뭔지 설명해보세요 (개발면접시간)
- 좋은 면접자/지원자가 되는 방법
- 네이버 면접 카카오 면접 그리고 라인 면접 후기
- 지원자도 회사를 평가합니다. 이렇게요.
- 안녕하세요, 프론트엔드 신입에 지원합니다.
- 프론트엔드 신입 개발자로 취업하게 된 30대 비전공자 면접 후기
- 카카오 면접 시 듣게 되는 70가지 질문
- 여기어때 면접에서 듣게 되는 질문 112가지
- 개발자 인터뷰 시 면접관에게 할 만한 질문 모음
- 구글 면접 과정 일기
📚 이력서/포트폴리오 작성
- 개발자 이력서 작성하기 (feat. 이력서 공개)
- 프론트엔드 개발자의 포트폴리오 웹사이트
- 신입 개발자가 포트폴리오를 준비할 때 알아두면 좋은 것들
- 그런 포트폴리오로 괜찮은가
- 취직 준비를 위해 좋은 포트폴리오 만드는 방법
- 야, 너두 개발자 포트폴리오 만들 수 있어 👉😉
- 개발적인 실력이 부족하여, 스스로를 어필하기 위해 써먹은 면접 전략
- Portfolio Website Tutorial – Frontend Development with HTML, CSS, JavaScript
- 이직초보 어느 개발자의 이력서 만들기
📚 채용 정보
🔗 참고
프론트엔드 개발자 & 통계적 머신러닝