[회사 면접 질문] 퍼블리싱 or 프론트엔드 개발 기술면접 예상 리스트

 

이전 포스팅에서도 언급했지만, 기술면접 관련해서 사실 크게 질문 받은 것이 없고 구현을 할 수 있느냐 없느냐에 대해서만 계속 얘기를 했었어서,,,,, 근데 기술면접 준비를 하면서 이론 공부를 정말 내가 안했구나... 아는게 많지 않구나...라고느꼈기 때문에 기술면접 준비를 하면서 이론 공부를 한다고 생각하면서 외우면 좋을 것 같다. 

먼저 이력서기반으로 회사 면접 질문 예상 리스트를 생각해 보았는데,

• 자기소개
• 지원동기
• 퇴사이유(경력직이라면)
• 지원한 직무에 대해서 아는대로?

이정도가 있겠다. 그래서 자기소개는 이력서에 적인 부분을 추려서 세네줄 정도로 적어서 자연스럽게 말하도록 외웠다. 지원동기는 회사의 장점과 내가 지원한 직무를 연결해서 동기를 부여했고 마지막에는 ~에서 일을 한다면 더 많이 배우고 역량을 펼질 수 있다고 생각해서 지원하게 되었다고 마무리 했다. 

퇴사이유는 경영악화라고 했고 너무 자세히 말을 하진 않았다. 뭐 대충 알겠지.....

직무에 대해서는 지원공고에 필요한 역량이나 업무내용을 추리고, 내가 지원했던 직무 경우는 퍼블리싱과 프론트 부분이라서 관련한 사이트를 언급하기도 했다.

회사 면접 질문 중에서도 퍼블리셔나 개발분야라면 기술면접을 준비해야 할 수 있다. 이론적인 부분을 많이 물어보는 회사의 경우에는 구현을 할 줄 알아도 그것을 남에게 설명하는 부분이 중요하다고 여길 수 있기 때문에 너무 장황하게 설명하게 되면 오히려 마이너스라고 생각해서 최대한 간추려서 준비했다. 대신 그 내용을 다 이해하는데 집중했다. 내가 말하면서도 무슨 말을 해야 하는 진 알아야 하니까,,,,,,,,

아래는 예상해본 회사 면접 질문 중 기술면접 부분이다.  

1. 웹접근성, 웹표준성?

- 웹접근성은 비장애인이나 장애인, 고령, 남녀노소 동등하게 웹브라우저를 사용할 수 있도록 구현하는 것을 말합니다.
- 웹표준성은 브라우저 종류나 버전에 상관없이 모든 사용자들이 동일하게 웹사이트를 볼 수 있도록 제작하는것. WC3문법 규정 준수

2.   HTML5란 무엇인가, 차이점은?

- 기존 웹 문서에서는 HTML만으로는 웹서비스를 구성하는 것이 불가능했지만 HTML5는 클라이언트와 서버와 통신이 가능해서 다른 외부 엑티브X 등을 사용하지 않고도 웹 서비스를 제공할 수 있는 기능들이 추가 되었다. 예를 들면 멀티미디어로 비디오나 오디오 기능을 자체적으로 지원하거나(박카스 동영상사례) 시멘틱태그로 웹 자료에 의미를 부여해서 사용자의도에 맞는 검색을 제공할 수 있다는 것이 차이점이다.

3. 자바스크립트의 지역변수, 전역변수 선언방법

- 전역변수는 함수 외부에서 선언된 변수로 프로그램 전체 접근 가능, 지역변수는 함수 내부에서 선언되는 변수라서 함수 외부에서 접근할 수 없다.

4. 자바스크립트 라이브러리 중 아는 것?

- 제이쿼리를 사용해 본 적 있다.  엘리먼트를 선택하는 강력한 방법과 선택한 엘리먼트들을 효율적이게 제어할 수 있는 다양한 수단을 제공함
- 예시로는 박카스 브랜드 홈페이지 드롭다운 메뉴(마우스엔터,리브) 또는 이미지 상하로 움직이게 하는(벌룬업)함수를 사용한 적 있다.

5.자바스크립트에 존재하는 데이터타입

- 문자열인 string, number, key와 value로 구성된 object, 배열, 함수, Null, Undefined, 불린

6. 워드프레스 사용 경험?

- 사용해 본적은 없지만 PHP로 작성된 오픈소스 웹사이트 제작 도구로 알고 있다. 템플릿 제공

7.  플러그인이란? 만들어 본 적?

- 웹 브라우저 표준기능을 확장해주는 프로그램
- 예를 들면, flash player가 있다. pdf 파일 삽일 할 때 embed 요소를 사용해서 html 문서에 추가할 수 있다.

8. 자바스크립트 라이브러리(library) 사용시 가장 큰 장점

- 어느 브라우저나 동일하게 작동한다. 특히 IE 지원. 문법이 단축되어 있어 간단하다.

9. 콜백함수란?

- 함수 속에서 또 다시 function 콜을 하는 것으로, 무엇인가 다른 일을 객체에게 시키고 그 일이 끝나는 것을 기다리지 않고 객체가 다시 부를 때까지 자신의 할일을 하고 있는 것.

10. 비동기적? 동기적?

- 동기적으로 실행된다는 것은, 코드가 차례대로 순서대로 실행되므로 만약 메시지를 보낸다고 하면, 메시지를 보내고 응답이 오기까지 아무것도 할 수가 없음. 코드 파악이 쉽고 유지보수나 디버깅이 훨씬 쉬운 장점이 있다. 다만 데이터가 오기까지 기다려야 하므로 시간 낭비가 될 수 있다.

11. 시간 반복 함수는?

- Setinterval(){} 함수. 예를들면 대림홈페이지 전시소개 부분에 3초마다 반복적으로 이미지가 올라가도록 설정함. 중지를 위해서는 clearInterval(){} 함수 사용

12. CSS 미디어쿼리 역할?

- 웹으로 구현한 부분들을 모바일이나 태블릿 등 다른 크기에 맞게 레이아웃을 구현하도록 만든는 것.  반응형웹에 쓰임
- @media screen and / only / all

13. CSS 의사선택자란?

- 선택하고자 하는 HTML 요소의 상태를 명시할때 쓰임
- link, hover, active / firsh-child, nth-child, first-of-type

14. 크로스브라우징과 CSS핵은?

- 크로스브라우징은 어느 브라우저에서든 동일하게 보여지도록 구현하는 것이고 webkit, moz,ms 등을 이용해서 특정한 브라우저 별(사파리나 파이어폭스, IE)에  적용되는 CSS를 CSS핵이라고 한다.

15. CSS 이미지 스프라이트 어떻게?

- 여러개 이미지를 하나 파일로 만들어서  웹에 포함하는 것으로, 메모리나 네트워크 사용량 측면에서 효율적입니다.

16. 구버전의 익스플로러(IE)를 지원하기 위한 방법을 말하시오.

- CSS 핵을 이용하거나 (-ms-high-contrast: active), (-ms-high-contrast: none)로 스타일링 따로 해주기

17. 자바스크립트만의 객체지향언어 설명

- 서로 연관된 변수와 함수를 그룹화한 것을 객체지향이라고 한다.
- 자바스크립트에서는 클래스가 없고 모든 것을 객체에 기반을 두며, 공통적으로 가지는 속성을 메소드라고 하는데 이를 저장한 공간이 프로토타입이며 이를 기반으로 한 언어다.

질문 리스트의 경우 구글에서 서치해서 뽑았고, 답변역시 모르는 부분은 다 서치해서 내식대로 정리를 한 것이다. 나는 면접에 크게 도움이 되진 않았지만, 이론공부를 하는데 굉장히 좋았다. 용어를 쓰면서도 그 용어가 뭔지 제대로 설명하기가 힘든 것이 많았는데 그게 좀 해결이 되었다. (물론 면접에서는 하나도 안나왔지만;;;)

다음 회사 면접 질문 중에서 인성면접 리스트를 추려서 정리해 볼 생각이다.