안녕하세요 클래스통입니다. ☺
IT 분야는 코로나19로 인해 취업난이 계속 오가는 와중에도 인기가 많은 분야죠. IT 취업 준비생이라면 프론트엔드 개발자에 대한 꿈을 가지고 계신 분들이 많을텐데요, 그 중 개념이 헷갈리시는 분들을 위해 프론트엔드에 대한 모든 것을 클래스통이 쉽게 설명해 드릴게요.
1. 프론트엔드와 백엔드 차이는?
- 프론트엔드
프론트엔드란 웹 페이지의 앞에 보이는 영역을 의미하는데, 웹 페이지에 접속했을 때 보이는 폰트, 컬러, 레이아웃 등의 모든 요소를 개발하는 거예요. 이런 웹페이지를 만들기 위해서는 HTML, CSS, JavaScript가 중요한 역할을 하는데 이 3가지가 무엇인지는 아래에서 알려드릴게요!
- 백엔드
백엔드는 프론트엔드와 반대로 웹페이지의 뒤에 해당하는 영역을 의미해요. 웹에서 사용자에게 보이지 않는 영역으로 주로 서버 관리 또는 개발을 담당하거나, DB를 담당하기도 해요.
2. 프론트엔드 개발자가 사용하는 언어는?
프론트엔드 개발자가 사용하는 언어는 크게 HTML, CSS, JavaScript 3가지인데, 이 언어들을 필수적으로 이해하고 있어야 웹 사이트의 구조를 만들고, 화면 스타일을 지정해 기능들이 상호작용을 할 수 있어요.
-HTML
HTML은 Hypertext Markup Language의 약자로 웹 화면 구조 설정이라는 뜻이에요. 한마디로 웹 화면의 뼈대를 만드는 프로그램 언어로 화면의 내용과 텍스트, 이미지 등의 정적인 요소를 나타내는 데에 사용이 돼요.
- CSS
CSS는 Cascading Style Sheet의 약자로 웹 사이트 스타일 지정이라는 뜻이에요. 스타일 시트라는 단어에서 알 수 있듯이 실제로 화면에 어떻게 보이는지를 위한 언어라고 보면 돼요. HTML에서 나타낸 화면의 내용과 텍스트, 이미지들의 폰트 컬러, 크기, 이미지 위치 등으로 화면 레이아웃을 꾸며주는 언어에요.
- JavaScript
HTML과 CSS로 제작된 웹 페이지에서 실행이 안 된다면 웹 페이지의 의미가 없는데요, 자바스크립트는 HTML과 CSS로 제작된 웹 페이지에 상호 작용성을 더해주는 언어를 말해요.
HTML, CSS, JS에 대해 더 자세히 알고싶다면? 👇
3. 리액트와 뷰의 차이점은?
이제까지 HTML, CSS, JS에 대해 알았다면 JS의 종류에 대해 알아볼 건데요. 리액트와 뷰는 모두 사용자 인터페이스(UI)를 위한 자바스크립트 프레임워크에요. 두 가지 모두 컴포넌트 기반으로 가볍고 빠르다는 장점을 가지고 있어요.
1. React
리액트는 2013년 페이스북에서 개발한 오픈소스 자바스크립트 라이브러리를 말해요. 프레임워크는 유지 보수가 어떻게 진행되는지가 가장 중요한데, 리액트의 경우 페이스북에서 개발하고 관리까지 하고 있기 때문에 걱정하지 않아도 된다는 가장 큰 장점이 있어요.
2. Vue
뷰는 리액트와 달리 전 구글 직원인 Even You가 개발한 프레임워크를 말해요. 리액트에 비해서 코드 구조가 간결하기 때문에 프레임워크를 처음 접하는 초보자 또는 웹디자이너들이 쉽게 이해를 할 수 있다는 큰 장점이 있어요.
React VS Vue 나에게 맞는 프레임워크가 무엇인지 알고싶다면? 👇
4. 프론트엔드를 현명하게 공부하고 싶다면?
이렇게 프론트엔드에 대해 간단히 알아보았는데요. 웹 개발 취준생이라면 기초 언어부터 하나씩 들어야 하는데 언어가 한 두가지가 아니다 보니 수강료가 부담스러울 수 밖에 없어요. 그런 분들을 위해 클래스통에서는 개별 강의로 원하는 부분만 골라 들을 수 있는 개별 강의 구매 시스템이 있는데요. 원하는 강의를 개별로 구매하기 때문에 시간적으로 효율이 높고 가격 측면에서 부담을 줄일 수 있는 단점이 있어요. 함께 프론트엔드 개발자를 온라인 클래스를 통해 준비해 보는 건 어떠신가요?
효율은 높이고 가격은 줄이면서 프론트엔드 준비하고 싶다면? 👇
👇 클래스통 1:1 카카오톡 실시간 상담 바로 가기 👇
👇 클래스통 홈페이지 바로 가기 👇
1
