티스토리

쥬르리
검색하기

블로그 홈

쥬르리

jurr.tistory.com/m

쥬르리 님의 블로그입니다.

구독자
1
방명록 방문하기

주요 글 목록

  • [Tailwind] justify Flexbox에서의 justifyjustify-start: 왼쪽 정렬justify-center: 중앙 정렬justify-end: 오른쪽 정렬justify-between: 첫 번째 아이템은 시작, 마지막 아이템은 끝, 나머지는 고르게 분포justify-around: 아이템들 사이에 동일한 여백을 두고 중앙 정렬justify-evenly: 아이템들 사이에 동일한 여백을 두고, 가장자리에 여백을 줌Grid에서의 justifyjustify-items-start: 각 아이템을 시작 위치에 정렬justify-items-center: 각 아이템을 중앙에 정렬justify-items-end: 각 아이템을 끝 위치에 정렬justify-items-stretch: 각 아이템을 가능한 최대 크기로 늘림 (기본값) 공감수 0 댓글수 0 2024. 9. 24.
  • [Tailwind] 브레이크포인트 Tailwind CSS의 기본 브레이크포인트  • sm: 640px • md: 768px • lg: 1024px • xl: 1280px • 2xl: 1536px 공감수 0 댓글수 0 2024. 9. 24.
  • [Tailwind] font-weight font-weight 클래스  • font-thin (100) • font-extralight (200) • font-light (300) • font-normal (400) : 기본값 • font-medium (500) • font-semibold (600) • font-bold (700) • font-extrabold (800) • font-black (900) 공감수 0 댓글수 0 2024. 9. 23.
  • [Tailwind] line-height leading 클래스 leading은 줄 간격을 제어하는 클래스  • leading-none: 줄 간격을 1로 설정 (텍스트가 꽉 찬 느낌) • leading-tight: 줄 간격을 1.25로 설정 (줄 사이가 약간 좁아짐) • leading-snug: 줄 간격을 1.375로 설정 • leading-normal: 줄 간격을 1.5로 설정 (기본값) • leading-relaxed: 줄 간격을 1.625로 설정 • leading-loose: 줄 간격을 2로 설정 (줄 사이가 넓어짐) 공감수 0 댓글수 0 2024. 9. 23.
  • [Next] App Router Route Group (라우트 그룹 : ())(폴더명) = ()는 주소창에 관여를 하지 않는다.app/(pages)/main 하면 주소는 /main이다.-> 주소에 영향은 끼치지 않고, 그룹화는 할 수 있음 공감수 0 댓글수 0 2024. 9. 23.
  • [면접준비] HTTP, HTTPS 차이 1) HTTP(Hyper Text Transfer Protocol) 웹 서버 통신을 위한 가장 기본적인 프로토콜이다. 암호화 되지 않은 평문으로 데이터를 전송하기 때문에, 중간자 공격 MITM*(man in the middle attack)이 가능하다. 80포트를 기본적으로 사용한다. * 네트워크 통신을 조작하여 데이터를 갈취하고 변조하여 공격하는 것 2) HTTPS(Hyper Text Transfer Protocol Secure) HTTP에 데이터 암호화(SSL: Secure Socket Layer)가 추가된 프로토콜이다. HTTP 통신에서 보안 취약점을 보완하여 공개키 암호화 방식을 거친다. 443포트를 기본적으로 사용한다 2-1) HTTPS의 대칭키 암호화와 비대칭키 암호화 대칭키 암호화 클라이언트.. 공감수 0 댓글수 0 2023. 1. 25.
  • [React] Virtual Dom 이란, DOM 이란, 브라우저에서 로드되며 노드 트리로 표현하는 도큐먼트 모델이다. 각자의 IDE에서 작성한 HTML은 DOM이 아니고, 작성된 HTML 문서가 브라우저에 의해 해석되어 실제 문서를 나타내는 노드트리가 DOM이다. 즉, DOM은 HTML과 자바스크립트를 이어주는 공간으로, 내가 작성한 HTML을 자바스크립트가 이해할 수 있도록 객체(Object)로 변환하는 것이다. Virtual Dom은 수정사항이 여러 가지 있더라도, 한 번만 렌더링을 한다. -> DOM이 생성되기 전, 이전 상태 값과 수정사항을 비교하여 달라진 부분만 DOM에게 한 번에 전달하여 한 번만 렌더링을 진행한다. -> DOM에 직접 접근해도 문제가 되진 않지만, DOM이 직접 변경된다면 사소한 변경사항에도 전체가 재렌더링 되기 때.. 공감수 1 댓글수 0 2022. 3. 1.
  • [React Native] Pod 란 CocoaPods는 Swift 및 Objective-C Cocoa 프로젝트의 종속성 관리자로 프로젝트에 필요한 외부 라이브러리를 CocoaPods를 통해 쉽게 관리하고 사용할 수 있다. podfile 은 React Native의 node 라이브러리들을 iOS와 이어주는 역할으로, 앱에 어떤 라이브러리가 종속되어 있는지, 라이브러리의 버전 등에 대한 정보를 입력한다. RN에서 라이브러리들을 npm이나 yarn에서 관리한다면, iOS에서는 pod에서 관리한다 는 개념이라고 생각하면 될 것 같다. (package.json과 비슷한 느낌) 공감수 1 댓글수 0 2021. 9. 13.
  • [React Native] module-resolver babel.config.js에서 alias를 설정하기 위해선 module-resolver 를 설치해야한다. **alias는 프로젝트를 진행하며 폴더에 쉽게 접근할 수 있도록 별칭을 추가하는 속성이다. module-resolver란, ESLint를 사용한 Babel module-resolver로 이를 사용하면 전체 자바스크립트 응용 프로그램의 상대 가져오기를 정리 할 수 있다. (= 절대 경로를 설정할 수 있다는 뜻) 상대 경로가 있는 폴더를 위아래로 이동하지 않으려면 응용 프로그램의 중요한 경로에 별칭(alias)을 추가하여 이러한 영역에서 모듈을 쉽게 가져올 수 있도록 한다. module-resolver 설치 yarn add -D babel-plugin-module-resolver babel.confi.. 공감수 1 댓글수 1 2021. 9. 8.
  • [React Native] Styled Component styled-components란, 자바스크립트 파일 내에서 css를 사용할 수 있게 해주는 css-in-js 라이브러리로 React 프레임워크를 주요 대상으로 한 라이브러리이다. styled-components 라이브러리 설치 npm install --save styled-components or yarn add styled-components 기본 문법은 styled.[컴포넌트 이름] 뒤에 백틱(`)을 사용하여 작성한다. (tagged template literal 문법) export const 변수이름 = styled.컴포넌트 이름``; 적용 main.js import React from 'react'; import {Wrapper} from './TodoInsert.style'; const Mai.. 공감수 1 댓글수 0 2021. 9. 6.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.