본문 바로가기

프론트엔드4

면접대비 질문 정리: 자바스크립트, 타입스크립트 면접질문 참고https://nomadcoders.co/community/thread/3979[diary] 프론트엔드 신입 면접 준비하기[면접준비] 프론트엔드 개발자 취업 면접 질문 및 답변 정리(64문)프론트엔드 면접질문 중요도별 정리[Frontend] 프론트엔드 주니어 개발자 면접 질문 (기술/인성) *실제 면접 시 질문 받았던 항목들에는 ⭐표시를 추가했습니다. 1. 객체지향이란?✅ 답변객체지향 프로그래밍이란 여러 개의 독립적 단위, 즉 객체의 집합으로 프로그래밍하는 것을 뜻합니다.생성자 함수를 통해 객체를 생성할 수 있고 생성자 함수 내에 속성(property)과 행동(method)를 지정하면 생성된 객체들은 공통된 속성과 행동을 사용할 수 있습니다.모듈화, 은닉화, 상속이 가능하다는 특징이 있습니.. 2024. 5. 1.
[React] 포트폴리오 웹 사이트 제작 일지-11. 프로젝트 이미지 슬라이더 수정(캐러셀 슬라이드), 프로젝트 완성 [React] 포트폴리오 웹 사이트 제작 일지-10. 프로젝트 슬라이더 만들기 및 반응형 웹으로 디자인 프로젝트 슬라이더 만들기 우선, project 컴포넌트 내부에 html로 작성해 두었던 프로젝트 내용들을 객체 배열 형태로 정리해서 projectItems라는 이름으로 따로 저장했다. export const projectItems = [ { title florescene.tistory.com 이전 포스팅에서 제작한 프로젝트 슬라이더를 실제 휴대폰에서 확인해 보니 사용감이 좋지 않았다. 화면의 제약 때문에 잘리는 내용을 보여주기 위해 스크롤을 달았는데, 스크롤 과정에서 프로젝트를 모두 보여주지 못하고 다음 컴포넌트로 넘어가는 일이 잦아서 결국 프로젝트 슬라이더는 제거해 버렸다. 대신 프로젝트에 들어갈 이.. 2024. 1. 9.
[React] 포트폴리오 웹 사이트 제작 일지-10. 프로젝트 슬라이더 만들기 및 반응형 웹으로 디자인 수정 프로젝트 슬라이더 만들기 우선, project 컴포넌트 내부에 html로 작성해 두었던 프로젝트 내용들을 객체 배열 형태로 정리해서 projectItems라는 이름으로 따로 저장했다. export const projectItems = [ { title: "🌓Dream note", category: "개인 프로젝트", imageUrl: ``, githubLink: "", deployLink: "", description: "", features: "", retrospective: "", techStack: "", }, { title: "⏰Stop Watch", category: "개인 프로젝트", imageUrl: ``, githubLink: "", deployLink: "", description: "".. 2024. 1. 6.
[React] 포트폴리오 웹 사이트 제작 일지-9. 스크롤 애니메이션 효과 추가 현재 포트폴리오에도 필요한 내용은 전부 들어가 있지만, 어딘지 밋밋해 보여서 스크롤을 내리면 컴포넌트 내용이 나타나는 애니메이션을 추가하기로 했다. 전체 컴포넌트를 관리하고 있는 App.js 파일에서 작업을 진행했다. ✨ 화면에 보이는 컴포넌트들의 state 정의 App.js const [visibleSections, setVisibleSections] = useState([]); 스크롤을 하면 App 내부에 import 된 컴포넌트가 하나씩 화면에 나타나야 한다. visibleSections는 '화면에 보이는 컴포넌트'들의 id를 저장하는 배열이다. 컴포넌트가 보여야 할 때 visibleSections에 컴포넌트 id를 넣어주어 화면에 컴포넌트를 띄워주도록 했다. ✨ useEffect Hook을 이용한.. 2024. 1. 2.
반응형

티스토리툴바