취업을 준비하며 정보처리기능사 필기에 도전 ! 아마 정처기 필기 1회는 24년 1월 28일쯤으로 시험 일정이 예상됩니다. 앞으로 한달 반 정도 남아서 그 시간에 취업을 위한 프로젝트도 하면서 정처기 필기 공부도 같이 하려구용 다른 사람들은 필요 없다고들 하는데 그래도 공부했다고 뭐라 할 사람 없을테니 한번 도전해봅니당 공부 계획 공부 기간 : 23.11.30 - 24.1.27 하루 공부 시간 : 3시간 채우기 하루 공부 내용 블로그에 정리해서 올리기
11월 27일(월) 공부 코드스테이츠 Section 1 Unit2,3 리마인드 11월 28일(화) 공부 코드스테이츠 Section 1 Unit2,3,4 리마인드 블로그에 공부 내용 정리 11월 29일(수) 공부 notion 공부기록 - 12월 목표 습관 캘린더 만들기 코드스테이츠 Section 1 Unit1 ~ Unit11 리마인드 블로그에 공부 내용 정리 11월 30일(목) 공부
px, em, rem 차이를 알아보자. 글꼴과 화면 등의 크기를 다룰때는 크기의 단위가 무엇보다 중요하며, 크기의 단위는 절대 단위와 상대 단위 두가지로 구분할 수 있다. 절대 단위 : px, pt 등 상대 단위 : %, em, rem, ch, vw, vh 등 절대 단위는 언제 사용 되나? 기기나 브라우저 사이즈 등의 환경에 영향을 받지 않는 절대적인 크기로 정하는 경우 : px 사용 반응형 웹에서 기준점을 만들 때 : 디바이스 크기를 나누는 기준을 보통 px로 정함 상대 단위는 언제 사용 되나? 반응형 웹 단위 선택시 : 주로 rem 사용 화면 너비나 높이에 따른 상대적인 크기가 중요한 경우 : vw,vh 사용 정리 px : 고정된 크기를 나타내며, 사용자 설정에 따라 확대/축소되지 않는 고정 크기의 ..
레이아웃 리셋은 왜 필요하며, 언제 해야 할까 ? 요소가 가진 기본 스타일에 약간의 여백이 있을 때 width,height 계산이 여백을 포함하지 않아 계산에 어려움이 있을 때 브라우저(크롬, 사파리 등)마다 여백이나 글꼴과 같은 기본 스타일이 조금씩 다를 때 기본 스타일링을 제거하는 CSS 코드 예시 * { box-sizing: border-box; } body { margin: 0; padding: 0; }
CSS는 웹 페이지 스타일 및 레이아웃을 정의하는 스타일 시트 언어이자, 더 나은 사용자 경험을 제공하기 위해 UI 및 레이아웃을 구성한다. HTML이 웹 페이지의 구조를 담당하면 CSS는 HTML로 구성한 구조의 외부와 내부를 꾸미는 역할을 담당한다. 좋은 사용자 경험 (user experience)은 직관적이고 쉬운 UI에서 나온다. CSS 문법 구성 ) 선택자는 요소이름이나 id 또는 클래스를 선택 중괄호 안에서 요소에 적용 할 내용 작성 (요소에 적용할 수 있는 내용을 속성이라고 함) HTML 파일에 CSS 적용 방법 link 요소는 HTML 파일과 다른 파일을 연결하는 목적으로 사용된다. 따라서, index.css 파일을 만든 후 href 속성에 연결한다. id & class id (식별자)는 ..
HTML (하이퍼텍스트 마크업 언어) 은 JavaScript와 같은 프로그래밍 언어가 아니라, 웹 페이지의 구조를 담당하는 마크업 언어이다. HTML 문서는 웹 브라우저에 의해 해석되어 사용자에게 웹 페이지를 제공하는 데 사용된다. 간단한 HTML 문서의 예 ) 안녕, MODAG! 이것은 간단한 HTML 문서의 예제입니다. HTML 문서는 파일 이름 뒤에 .html로 만들 수 있다. ex ) index.html 또한 , , , , , 등은 HTML 요소를 나타내며, 각각이 특정한 의미와 역할을 가지고 있다. 시멘틱 요소 (의미가 있는,의미론적인) HTML5에서는 시멘틱 웹이 중시되면서 시멘틱 요소가 새롭게 만들어졌다. 시멘틱 요소 중 하나인 요소를 예로 들면, 최상위 제목을 표현할 때 사용하는 요소 을 ..
10월 2일(월) 공부 이력서 프로젝트 시작 프로젝트 환경 설정 셋팅하기 스택 결정에 필요한 지식 습득 (next.js,Tailwind CSS,Prettier 등 왜 써야하는지,설정 어떻게 해야하는지) gitmoji 사용법 습득 - https://gitmoji.dev/ : 참고 유데미 Next.js 강의 시청 원티드,사람인 등등 프론트엔드 취업 시장 조사
취업을 위한 이력서 사이트 제작을 시작해봅니다. 기본 스택은 Next.js + typeScript + Tailwind CSS로 잡았습니다. Next.js로 프로젝트 환경설정을 하게 된 이유는 그동안 vite로 프로젝트를 진행하기도 했었고, 서버 사이드 렌더링 (SSR) 및 정적 사이트 생성 (SSG) 지원 기능으로 이러한 기능을 통해 웹 애플리케이션의 성능과 검색 엔진 최적화를 향상시키고 사용자 경험을 향상시킬 수 있다고 합니다. 이 기능이 vite나 일반 리액트 프로젝트에는 없어서 이 기능을 어떻게 사용해야 할지 어떤 기능인지 알아보고 싶어서 선택하게 된 점도 있습니다. CSS 또한 그동안 Styled-components를 많이 사용해보기도 했고 Tailwind CSS를 통해 클래스 기반 스타일링을 통..