복잡한뇌구조마냥

0. 와이어프레임 1. FormData를 이용한 사진등록 // 확장자 정규식을 통한 관리 가능 var fileForm = /(.*?)\.(jpg|jpeg|png|gif|bmp|pdf)$/; const onChange = async(e) => { // input file에서 선택된 file을 img로 지정 const img = e.target.files[0]; // 이미지 파일이 아니면 이후 동작을 생략하고 경고문구 출력 if(!img.name.match(fileForm)){ alert("이미지파일(.jpg, .png, .bmp)만 올려주세요.") return } // 폼데이터 형식 선언 const formData = new FormData(); // api에서 요구하는 key값과 value값 지정 (ke..

49.javascript ES6에 추가된 것은 무엇인가요? - 1. Block scope 변수 - let, const - 2. String Literal - ` ${변수}` 기법 - 3. 객체 비구조화 객체의 특정 값을 받아오는 방식으로 작성 가능 ex ) const {id} = useParams(); es5 : useParams().id - 4. 프로퍼티 초기화 단축 : key, value가 동일 시 생략하는 기능 - 5. for in, for of 기법 - 6. 화살표 함수 (가독성 증가 | this 바인딩의 차이, 생성자 함수 사용x, arguments객체 생성x, 호이스팅x) 50. ES6에서 화살표 함수를 언제 쓰고 왜 쓰는지 설명해보세요 - 1. 코드의 간결성을 위해서 - 2. 콜백 함수 th..

0. R & D란? - R&BD R&D 초기단계부터 사업성을 검토하고 단계별로 연구를 수행, 사업화가 가능하도록 단계마다 연구방향을 설정 조정해 나감으로 성과 극대화 - R&D (Research & Development) 연구개발의 정의로 연구는 새로운 과학적 기술적 지식과 이해를 얻기 위하여 행해진 독창적 계획적 조사, 개발을 상업적 생산이나 사용하기 이전에 새로운 또는 개량된 재료, 장치, 제품, 제조법, 시스템 또는 서비스 생산계획, 설계 등에 지식을 적용 1. 빅 데이터란? - 거대한 규모(volume), 빠른속도(velocity), 높은 다양성(variety)을 특징으로 하는 데이터 - 3V - 새로운 데이터 소스에서 나온 더 크고 더 복잡한 데이터 세트 - 데이터를 샇고 분석해서 원하는 데이터..

37. Flexbox 사용해봤나요? 사용해봤다면 어떻게 사용했나요? - 반응형 웹을 제작하면서 헤더나 푸터의 요소의 수직정렬을 위해 사용 경험 장바구니 페이지를 연습삼아 만들어 본 경험이 있는데 요소를 수직에서 관리할 때 사용 용이 38. css margin, padding 각각 어떻게 사용하며, 차이점은 무엇인지 설명해보세요 - margin과 padding은 css 박스모델 기준으로 content를 감싸는 것은 padding, border을 감싸는 것은 margin으로 border기준 내부와 외부의 차이가 있음 39. position을 어떻게 적용했는지 설명해보세요 - static, relative, absolute, fixed설명 40. Restful API에 대해서 아는대로 설명해보세요 - Rest..

25. 브라우저 렌더링 과정에 대해 설명해보세요 - 브라우저 url을 통해 dns서버에 연결된 해당 ip로 가서 protocol 방식을 통해 통신하여 데이터를 불러옴 (여기가 핵심) → 데이터를 파싱하여 DOM트리를 불러와 화면을 구성 → 중간중간 css 형태 구성 → 자바스크립트는 후에 실행 26. 웹팩과 바벨에 대해 설명해보세요 - 웹팩 - 파일을 하나로 만들어주는 모듈 번들러 - 바벨 - 호환되지않는 문법을 최적화하게 만들어주는 트랜스 파일러 27. CSR과 SSR의 차이가 무엇인가요? - CSR - DOM 형식으로 클라이언트 기반으로 화면구성 - SSR - 서버에서 html을 변경하는 등 구성을 다루는 주체가 서버인 렌더링 28. CORS가 무엇이고 이를 처리해본 경험을 말씀해주세요 - CORS란..

13. React와 Vue, Angular의 차이점은 무엇인가요? - React - 자바스크립드 기반, 가상돔, JSX, 단방향 바인딩 - Vue - 타입스크립트 지원, 가상돔, 단방향, 양방향 바인딩 지원 - Angular - 타입스크립트, 실제돔, 양방향 바인딩 14.React에서 JSX 문법이 어떻게 사용되나요? - virtual DOM에서 컴포넌트 변화를 감지할 때 효율적으로 비교할 수 있도록 컴포넌트 내부는 하나의 DOM트리 구조로 이루어져야한다는 규칙이있다. - 자바스크립트 표현식을 쓰려면 코드를 {}로 감싸주면 된다. - if, for문 대신에 삼항연산자 or map함수 허용 - 인라인스타일 적용시 카멜문법 사용 필요 15. React의 렌더링 성능 향상을 위해 어떻게 해야 하나요? - 불필..

1. var, let, const 차이를 설명해보세요 - var은 ES6이전 문법으로 지역과 함수레벨의 스코프를 지니고 있으며, let과 const는 ES6 문법에 추가된 내용으로 블록레벨의 스코프를 지니고 있습니다. let과 const의 차이는 const는 선언과 동시에 초기화를 해줘야합니다. 2. 이벤트 버블링과 캡처링에 대해 설명해보세요 - 버블링은 하위 요소에서 상위요소로 이벤트가 올라가는 과정을 얘기하고, 캡처링은 반대로 상위에서 하위로 내려가는 반응을 합니다. 버블링을 막는 방법은 stopPropagation을 활용하여 버블링이 더이상 퍼지지 않도록 할 수 있습니다. 버블링을 사용하는 이유는 하위 요소를 눌렀을 때 상위요소로 올라가기 때문에 이벤트 위임을 사용하기 용이합니다. 따라서 상위 요소..

1. 브라우저에 ‘naver.com’을 입력하면 내부적으로 어떤 일이 일어나는지 설명해주세요 - url로 되어있는 http요청을 DNS를 통해 host에 해당하는 실제 IP주소로 변환하여 서버에 요청 1. DNS 서버에서 도메인 → IP주소 변환 2. IP주소로 HTTP 데이터 전송 3. HTTP 요청정보를 TCP 프로토콜로 전송 4. 서버는 HTTP로 받아 URL데이터 탐색 5. 서버 → 브라우저 응답 , HTTP메세지전송 6. 응답메세지 렌더링, TCP프로토콜 전송 7. 브라우저가 파싱 및 렌더링 과정 → 화면 2. 웹 브라우저 공격을 아는대로 설명해주세요 - *SQL Injection 서버에 실행되는 SQL을 악의적으로 이용하는 공격 악의적인 SQL 구무능 삽입하여 데이터를 탈취, 삭제 할 수 있다..