프론트엔드 개발자의 입지가 커졌다?!

📍늘어나는 프론트엔드 수요

과거에 프론트엔드 개발자는 클라이언트(사용자) 화면의 작은 부분만을 담당했습니다. 하지만 지금은 그들이 웹 개발에서 점점 중요한 역할로 확장되고 있으며, 이에 따라 프론트엔드 개발자 수요는 늘어나고 있습니다.

많은 영역으로 확장이 가능한 자바스크립트(JS)!

📍확장성이 좋다는 것은, 가성비가 좋다는 것.

웹은 물론이고, 모바일 애플리케이션, 데스크톱 응용프로그램까지 확장된 자바스크립트를 배우고, 프론트엔드를 학습하면 많은 기회가 여러분 앞에 펼쳐질 것입니다.

Javascript는 ES6 (자바스크립트 표준) 발표 시점과 더불어 상당히 매력적인 언어로 탈바꿈하였습니다.

과거 웹 화면에만 머물렀던 것에서 더 나아가, 웹 개발에서 상당히 중요한 역할을 차지하게 되었고, 심지어 서버의 역할도 할 수 있게 되었습니다.

또, 여러분들이 잘 알고 계시는 인스타그램, 디스코드, 스카이프, Visual Studio Code 등이 모두 자바스크립트로 만들어졌다는 사실 알고 계신나요? 이처럼 자바스크립트는 다양한 영역으로 확장되고 있습니다.

하지만 확장된 만큼 난이도 또한 필연적으로 높아지고 있죠. 우리는 어떻게 프론트엔드와 자바스크립트를 정복해야 할까요?

이론말고, 실전으로 익히세요.

📍퍼즐게임과 타자 연습게임 등을 같이 만들어보며, 쉽게 학습합시다.

저는 프론트엔드에 필요한 지식과 필수적인 ES6의 모던 자바스크립트를 통한 클래스를 진행하고자 합니다. 최대한 실전에 가깝게, 재미있게 학습하게 도와드릴게요.

이론만이 아닌 실습, 실전으로 다져진 노하우는 잊고 싶어도 잊을 수가 없게 됩니다. 이 클래스를 들으면 자연스럽게 HTML, CSS, JS의 단순한 코딩을 벗어날 수 있고, 최신 개발 흐름도 따라갈 수 있게 될 거예요.

프론트엔드 개발, 구체적으로 뭘 배우게 될까요?

📍1챕터: HTML, CSS가 무엇인지 아주 간단하게 요약하기

HTML5의 기본기, CSS3의 기본기를 각각 배우고, 생산성을 좌우하는 Grid와 Flex에 대해 알아보겠습니다.

그 후 부트스트랩, 머티리얼 디자인, CSS 프레임워크 등에 대해 알아보고, 요즘 트렌드에 맞는 개발자가 되기 위해 SASS를 활용한 레이아웃 잡기를 학습할 겁니다.

📍2챕터: 자바스크립트(ES6)를 실습으로 배워보기

오늘날 자바스크립트가 갖는 중요성과 비전에 대해, 그리고 자바스크립트 표준이라고 불리는 ES6에 대해 알려 드릴게요.

그 이후부터는 계속 실습할 겁니다. 변수&데이터 타입, Object&Array, 조건문&연산, 메소드 함수, 객체지향 프로그래밍, DOM 다루기 등을 차례차례 실전으로 배워봅시다.

📍3챕터: 라이브러리 없이, 순수 자바스크립트만으로 투두 앱 만들기

퍼블리싱, DOM, Storage 저장하기 순서로 정말 라이브러리 없이 순수한 앱을 만들어볼거예요!

📍4챕터: 오픈 API를 이용한 날씨 검색 앱 만들기

axios 사용법을 알아보고, Postman을 활용한 RESTful 테스트를 해볼 예정입니다. 그 후에는 퍼블리싱과 프로그래밍을 실습합니다.

📍5챕터: 타자게임 만들기

아까 말씀드렸던 부트스트랩, 플렉스, 그리드를 이용한 퍼블리싱을 배웁니다. 그리고 상태 관리 메소드를 만들고, 인터벌과 DOM, toast 라이브러리 추가해보기 등을 해볼게요. 내친김에 랜덤 단어 API도 적용시켜 봅시다.

📍6챕터: 퍼즐게임 만들기

이번에는 백그라운드 어태치먼트, 트랜지션 고급 CSS 등을 이용해 퍼블리싱 해봅시다. 그리고 내장 객체 사용하는 법과 drag 이벤트를 직접 만드는 법도 배울 거예요. 마지막으로 리팩토링을 이용해 코드를 더욱 깔끔하게 만들고, 마무리 프로그램을 만듭니다.

프론트엔드 첫걸음을 알려드릴 개발자 Scalper 입니다.

📍풀스택 개발자에서 프론트엔드 개발자가 되다.

반갑습니다, 개발자 Scalper 입니다. 저는 풀스택 개발자로 일을 해오다가 프론트엔드에 관심을 가져 프론트엔드 개발자로 전향했습니다.

이후 한화, 공항공사, 유로스타 관광 플랫폼 등 다양한 프로젝트들을 진행해 왔습니다.

• 한화솔루션 공장안전시스템
• 한국공항공사 유동인구 모니터링 시스템
• 유로스타 스마트관광플랫폼 : 스위스업체 컨소시엄
• 대구테크노파크 스마트팩토리 사업
• 담양군청 포탈사이트 웹표준, 접근성 작업
• 구미시청 통합사이트 관리
• 연세대학교 뇌인지과학연구소 실험 솔루션
• 여주대학교 간호성과 관리 시스템
• 한동대학교 스마트마일리지 어플리케이션

최근에 자바스크립트, 프론트엔드를 강의했던 것이 제게는 의미있는 경험이 되었고, 더욱 본격적으로 클래스를 진행하는 크리에이터가 되어 가고 있네요.

과거의 레거시 코드가 아닌,

모던하고 깔끔한 ES6 자바스크립트를 배우는 것

📍프론트엔드 개발자로 성장할 수 있는 기반을 마련하는 클래스

인터넷에 떠돌아다니는 정보들을 봐도 무슨 말인지 모르겠다는 그 심정을 이해합니다. 당최 무슨 말인지, 어떻게 시작해야 하는지 막막했던 분들에게는 최적의 클래스가 될 거예요.

한 챕터씩 배울 때마다, 실제로 이것이 어떻게 활용되고 작동하는지 실습으로 터득하게 돕겠습니다. 이제 단순한 코딩에서 벗어나, 진정한 모던 개발자로 거듭나세요.

모던 바닐라 자바스크립트로 배우는 프론트엔드 첫걸음!

그럼, 클래스에서 뵙겠습니다.

클래스 실습 환경 안내

📍기본 프로그램

• chrome
• visual studio code

👨🏻‍💻실습 프로그램

• postman
• node.js
• git
• soucetree