[Frontend] 프론트엔드 주니어 개발자 면접 질문 (기술/인성)
·
Archive
Junior Frontend Developer(1년차 이하)로 면접을 보면서 자주나왔던 질문들을 정리한 내용입니다.빈도 상(빨강) / 중(노랑) / 하(초록)으로 구분하였습니다.큰 틀을 정리하는 차원에서 기본적인 키워드만 기록했습니다. 자세한 사항은 추가 검색으로 정리하시길 바랍니다.    HTML   html?HTML (Hypertext Markup Language,하이퍼텍스트 마크업 언어)우리가 보는 웹페이지가 어떻게 구조화되어 있는지 브라우저로 하여금 알 수 있도록 하는 마크업 언어입니다.- 마크업 언어(markup 言語, markup language)   태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어입니다.- 마크다운 언어는 마크업 언어의 일종으로 우리가 흔히 사용하는 .md 확장자의 ..
[Next.js] getStaticPaths (Static Generation/fallback/동적 라우팅)
·
Archive
1. getStaticPath 예시 2. fallback 동적 라우팅 페이지에서의 pre-rendering Next의 pages폴더에서 [대괄호]로 파일명을 생성하면 동적 라우팅을 할 수 있다. 이 때 주의해야 할 점은 Next는 모든 페이지를 사전생성 하지만, 동적 페이지에서는 그렇지 않다는 점이다. 동적 페이지에서 getStaticProps를 사용하여서 페이지에 진입하게 되면 아래와 같은 에러를 만나게 된다. 대괄호 [ ]로 만든 동적 페이지는 엄밀하게 따져서 하나의 페이지가 아닌 여러 페이지이다. 때문에 Next는 사전에 동적 페이지를 위해서 얼마나 많은 페이지를 미리 생성해야할지 알 수 없다. 이럴 때 비동기 함수 getStaticPaths를 이용하여 Next에게 어떤값에 대한 페이지가 pre-r..
[알고리즘/JS] 최대값 최소값 제외한 배열 요소의 합 (reduce)
·
Archive
Task Sum all the numbers of a given array ( cq. list ), except the highest and the lowest element ( by value, not by index! ) The highest or lowest element respectively is a single element at each edge, even if there are more than one with the same value. Mind the input validation. Example { 6, 2, 1, 8, 10 } => 16 { 1, 1, 11, 2, 3 } => 6 If an empty value ( null, None, Nothing etc. ) is given in..
[Next.js] Pre-rendering 개념 & Static Generation(getStaticProps)
·
Archive
1. Pre-rendering이 필요한 이유 2. Pre-rendering의 2가지 방식 3. Static Generation 4. Build 5. ISR 정적페이지 업데이트 Pre-rendering이 필요한 이유 SPA(Single Page Application) 인 React로 구현된 사이트는 하나의 파일로 전체 사이트(여러 페이지)를 구현한다. 즉, html 파일이 한개라는 뜻인데, 이 HTML을 JavaScript가 동적으로 만드는데 동적생성이 만들어지는 곳이 client라면 CSR(Client Side Rendering)이고 server 쪽이라면 SSR(Server Side Rendering) 이다. React는 CRA(Create React App)으로 별도의 초기 설정 없이도 CRA를 통해 ..
[Regex] 정규 표현식 기초 (2) - 대괄호 / 부정부호 / 꺽쇠
·
Archive
https://manon-kim.tistory.com/entry/Regex-%EC%A0%95%EA%B7%9C-%ED%91%9C%ED%98%84%EC%8B%9D-quantifier [Regex] 정규 표현식(1) - Quantifier 수량자 What is a Regular Expressions? Not matching exact strings Instead, matching patterns of strings 정규표현식, 또는 정규식은 특정 문자 조합을 찾기위한 패턴이다. Regular Expressions = regex (Regg-ex or Redge-ex로 발음한다.) 🌟 manon-kim.tistory.com [ ] 대괄호 [ ] square bracket 대괄호 안의 문자중 어떤 것도 선택할 수 ..
[JS] JavaScript 개념 (자바스크립트 엔진, 원시형/참조형, Stack/Heap)
·
Archive
JavaScript 란?   JavaScript is a dynamic, weakly typed programming language which is compiled at runtime.자바스크립트는 런타임에 컴파일되는 동적, weakly 프로그래밍 언어이다.browser 에서 webpage의 일부로 실행될 수도 있고, host환경이라 불리는 모든 머신에서 직접 실행될 수도 있다. JavaScript was created to make webpages more dynamic.자바스크립트는 웹페이지를 보다 동적으로 만들기 위해서 생성되었다.새 페이지를 로드하지 않고도 웹사이트의 내용을 변경할 수 있도록 브라우저에서 실행된다.  * 최초에는 LiveScript라고 불렸는데, 당시 Java의 인기로 인해서 J..
[JS] JavaScript ES6 - var / let / const
·
Archive
ES6 ? > ECMAScript : 자바스크립트 표준명세서 (JavaScript는 ECMAScript의 특정 버전이라고 할 수 있다.) ES6 = ES2015 (ECMA International에서 버전을 발표할 때 표기하는 정식 명칭은 연호를 사용해서 ECMAScript 2015) Modern JavaScript : 현시점에 사용하기 적합한 범위 내에서 최신버전의 표준을 준수하는 JS > javascript는 프로그래밍 언어이고, ECMAScript는 프로그래밍 언어의 표준. (ECMAScript는 JavaScript가 갖추어야 할 내용을 정리해둔 '설명서'이고, JS는 ECMAScript를 준수해서 만들어낸 '결과물') > ECMAScript가 JavaScript화 하기 위해 등장하긴 했지만, Ja..
[AWS] 인스턴스 종료 & 과금 결제 환불 신청
·
Archive
1. AWS 인스턴스 종료 2. AWS 환불 방법 AWS 인스턴스 종료 1. AWS 접속 - 로그인 - 검색창에 ec2 검색 2. 좌측메뉴 - 인스턴스 * 비용 발생하지 않도록 중지 / 종료 대상 인스턴스 우클릭 > 인스턴스 상태 중지 or 종료 AWS 환불 방법 1. aws 로그인 - 지원센터 2. 중앙에 Create case 버튼 클릭 3. Account and billing - Service Billing - Category Payment Issue 4. 환불 사유 입력 ex) AWS 공부 위해서 사용했었고,사용 후 인스턴스 삭제해서 종료되었는 줄 알았는데 아니었다 블라블라 ~월에 ~달러 결제되었는데 환불해주세요~ 땡큐~ 5. Contact us - English - web - submit
[SEO] 검색엔진 최적화 (네이버 검색 최적화 설정 방법)
·
Archive
Search Engine Optimization SEO(검색 엔진 최적화)란? 특정 사이트(google, naver 등)에서 키워드 검색 시 검색엔진의 결과 순서대로 웹사이트가 나열되게 되는데, 이 때 웹페이지의 상위 노출도를 높이는 작업이 검색 엔진 최적화 작업이다. 사이트 내의 콘텐츠를 검색엔진이 잘 이해할 수 있도록 정리하는 작업 사이트 내 콘텐츠가 검색결과에 누락되지 않도록 설정 사용자가 원하는 콘텐츠의 내용을 검색엔진에게 알림 https://channelsearch.naver.com/tech/issue04_1/?pcode=naver_pcsearchmktbanner CH.SEARCH - 네이버 검색이 사용자의 눈높이를 맞춰가는 법 '프로젝트 AURORA', 궁극의 검색 최적화를 위해 channel..
[Regex] 정규 표현식(1) - Quantifier 수량자
·
Archive
What is a Regular Expressions? Not matching exact strings Instead, matching patterns of strings 정규표현식, 또는 정규식은 특정 문자 조합을 찾기위한 패턴이다. Regular Expressions = regex (Regg-ex or Redge-ex로 발음한다.) 🌟 정규표현식 연습하기 좋은 사이트 https://regex101.com/ regex101: build, test, and debug regex Regular expression tester with syntax highlighting, explanation, cheat sheet for PHP/PCRE, Python, GO, JavaScript, Java, C#/.NET..