JavaScript역할의 변화
과거의 역할
- 간단한 유효성 검사
- 간단한 AJAX 통신
현재의 역할
- 애플리케이션 (SPA, 메일, 지도 등)
-
서버 사이드인 JSP를 이용해서 동적으로 html을 만들었으며 JavaScript는 그 일부안에 존재했었다. (form요소, submit, input 등을 눌러서 서버에 전송하는 역할)
-
서버에서 체킹하는 시간이 1초 이상이 되고 사용자 입장에서 너무 느리다는 입장이 많아져서 javascript에서 유효성 검사가 탄생했다.
(ex. 전화번호 input에 문자열을 입력 후 submit버튼을 누른 경우,)
AS IS
서버에 갔다 와야 유효성을 파악할 수 있었음
TO BE
서버에 다녀오지 않아도 input.value의 값을 이용하여 JavaScript로 유효성 검사를 하고 문자열이 있으니 alert창을 띄웠다.
-
JavaScript의 사용은 웹 페이지를 좀 더 화려하게 보여주도록 이용을 많이 했다. (ex. 애니메이션 효과)
-
간단한 데이터 전달을 할 경우에 이용할 때 사용하였다. (submit을 통해서 post로 전달을 했다면 AJAX 통신을 이용해서 전달을 할 수 있는 기술로 발전하였다. )
이렇듯 과거의 JavaScript는 중요하지 않고 부수적이며 도움을 주는 언어였다면 현재 웹 프론트에서 JavaScript는 한 영역이 되었다.
Front End의 변화
Front End의 과거
과거에는 서버사이드에서 HTML를 생성하고 활용 하였다.
(ex. a태그를 누른 경우, 해당 페이지에 대해 서버를 다시 요청해서 그 페이지를 만들어 준 다음 화면을 갱신하는 형태였다.)
a태그를 누르면 반짝이면서 페이지 전체가 reload되는 형태
과거의 웹 개발자 면접 질문
- 웹에 대해 jsp, php, db등에 대해 얼마나 알고 있는지
- 간단한 쿼리를 짤 수 있는지
- javascript에 대한 질문보다 jquery를 얼마나 잘 사용하는지
ie6,ie,크롬,파이어폭스,사파리 등 브라우저가 많이 있었고 브라우저들은 동일하게 동작을 하지 않았다. 그래서 JavaScript를 사용할 때 가장 중요한 점은 크로스브라우징에서 동일하게 동작할 수 있는 것을 만드는 것이 굉장히 중요하였다.
Front End의 현재
현재에는 HTML이 있고 JS가 있다.
지금은 이 형태에서 내가 원하는 데이터를 AJAX등의 기술을 이용하여 서버에 요청한다. 데이터를 JSON을 통해 받은 뒤, 이 데이터를 가지고 페이지의 일부분을 갱신한다.
일부만 수정되는 형태, 이것이 바로 SPA(싱글 페이지 아키텍처)이다.
최근에는 이런식으로 개발을 많이 하기 때문에 이걸 많이 도와주는 프레임 워크(vue, react, angular)가 많이 등장하게 되었다.
따라서 현재에는 과거와 달리 javascript를 사용해서 아키텍처를 얼마나 잘 짜느냐가 중요해졌다.
현재의 FE 개발자 면접 질문
- 애플리케이션 구조를 얼마나 잘 짜는가
- javascript를 얼마나 잘 아는가
해당 포스팅은 썬한 코딩, 입사에 필요한 JS기술의 내용을 보며 공부한 것을 정리한 내용입니다.
참고 사이트
