우롱이 공책정리

PC 해상도 : 1280 px 모바일 해상도 : 360 x 640 제일작은 Container : 안에 담기는 내용의 최대 폭 1200px 을 추천 전체폭은(max-width) 1920px 컨테이너는(내용) 1200px 칼럼 웹기준으로 12단 추천 2,3,4,6단으로 나눌때도 정수값 가이드라인 잡기도 편하고 퍼블리싱 간편 너무 단을 많이 쪼개면 반응형에 취약 거터는 30px 추천 칼럼은 72px로 딱 떨어짐 출처 : www.youtube.com/watch?v=iqv9CDY-QCA&t=89s 출처 : www.youtube.com/watch?v=Q_gcAAKfGKw&t=434s

칼럼(Columns) 실제로 컨텐츠를 포함하는 부분은 칼럼이라고 합니다. 칼럼의 넓이는 고정된 값으로 제공되며, 1개 이상의 칼럼이 조합하여 컨텐츠의 크기를 결정합니다. 그리고 하나의 칼럼 안에는 반드시 양 옆에 여백, 즉 거터를 동반합니다. 거터(Gutters) 거터는 칼럼과 칼럼사이의 공간입니다. 1개 이상의 칼럼이 조합된 컨텐츠와 컨텐츠 사이의 간격이 됩니다. 거터의 넓이 역시 고정 값으로 제공하며, 스크린의 너비에 비례하여 넓은 거터는 큰 스크린에 적합니다. 칼럼사이에 공백을 더 많이 생성하기 때문입니다. 마진(Margins) 여백은 내용과 화면의 왼쪽 및 오른쪽 가장자리 사이의 공간입니다. 여백 너비의 넓이도 고정 값으로 정의되며, 여백 역시 큰 여백은 내용의 둘레에 더 많은 공백을 만들기 때문..

마우스 올렸을 때 호버말고 ::after, ::before 도있다는걸 까묵지말자

line-height값은 font사이즈에 맞게 커지고 줄어들어야 보기에 자연스러운데, 값을 px단위로 설정하면 값이 그 px크기만큼으로 고정되어 font사이즈를 수정하게되면 너무 좁거나 너무 넓게 된다. 그래서 보통 line-height: 1.5; 와 같은 식으로 상대적인 값으로 입력한다. 출철 :velog.io/@ursr0706/line-height-%EC%86%8D%EC%84%B1 line-height 속성 css의 line-height 속성에 대한 내용 정리 velog.io

z-index는 값이 높을수록 맨 앞에 쌓임 기본값은 0 더보기 z-index 값을 따로 설정하지 않으면 기본 값은 0이다. 여러 박스들 중에 a라는 박스에 z-index: 1; 값을 넣으면 a박스가 다른 박스들 보다 제일 앞에 나와 보인다. (추가적인 레이어를 생성하고, 여기에 a박스를 위치시킴) 그리고 b라는 박스에 z-index: 2; 값을 넣으면 b박스가 a박스보다 더 앞에 나온다. (레이어가 2개가 더 추가된 것임.) 만약 같은 레벨의 레이어에 있다면, 나중에 배치된 것이 우선적으로 보여진다. 출처 ↓ dream-frontend.tistory.com/31 z-index 란?! 우리들은 HTML 페이지를 2차원 평면으로 생각한다. 왜냐하면 여러 텍스트, 이미지와 다른 엘리먼트들이 서로 겹치지 않고..

함수 : rsf import React from 'react'; const CompCount = () => { return ( ); }; export default CompCount; rsc import React from 'react'; const CompLast = () => { return ( ); }; export default CompLast; rcc import React, { Component } from 'react'; class CompBodyClass extends Component { render() { return ( ); } } export default CompBodyClass;

스프링부트는 태생이 레스트임 그리고 스프링부트는 디펜던시 버전관리를 따로 해주지않아도 된다 https://github.com/ihoneymon/spring-boot-orm-learn/blob/master/THYMELEAF_TEMPLATE_ENGINE.md https://www.thymeleaf.org/ thymeleaf 타임리프에 관해서 참조하는 사이트 https://www.thymeleaf.org/documentation.html 타임리프 적용해보는 방법 나와이뚬~ 아무 버전이나 가지고와~! 저장하기전에 반드시 버전을 빼고 저장!! jstl위에 붙여놓음 버전 부분 삭제 한후 저장~~! 데이터 제이피에이를 가지고오면 orm tx이런거 등등 가지고온당~ 우리가사용하는 버전 2.x를 사용해서 위에 두개 디펜..

리액트의 철학은 값을 set할때 this.setState로함 스프링의 rootPath라 보면됌! 우리는 원래 컨텍스트라고 하지만 리액트에서는 proxy라함 왜냐하면 리액트에서 context라는 애가 따로 또 있어서! >> package.json 프롭스로로 전달받은거는 항상 ReadOnly여서 리액트라우터돔에있는 링크라는 컴포넌트를 가져다가 쓰는 것 : a태그와 비슷함!! >> BBsNav.jsx

react-bbs 화살표 함수가 아니라 function으로 함수를 사용하면 this 가 애매해져버린다. 그래서 화살표 함수로 쓰라고 권장하는 중!! this.가 가르키는 곳이 파일이 될수도 있고 해서 화살표 함수를 쓰면 this가 명확해진다! Node_bbs_server ejs : 인베디드 자바스크립트 jsp : java Server page Html + java코드를 인베디드한 친구 자바코드로 다시 변환되고 클래스형식으로 만들어짐 톰캣이 이 일을 대신함 노드몬의 스타트 파일 제일먼저 실행이 된다. >> packege.json 이게 열리는거임 >> app.js require는 import라고 생각해도 무관! http : html 문서를 인터넷으로 주고받을때 사용하는 프로토콜(통신규약) , 웹에서 사용하는..