전체 글 (74) 썸네일형 리스트형 React 정리(생활코딩 React) - 추가 중 1일차 1. 리엑트를 쓰는 이유는? 1.1. html 코드를 캐비냇으로 정리한다 1.2 컴포넌트, 즉 사용자 정의 태그 2. 리엑트 개발환경 설치 방법 2.1. 툴 체인과 create-react-app 2.2. create-react-app의 설치방법, 그리고 npm과 npx 2.3. 리엑트 앱 실행 3. 리엑트 앱 코딩하기 3.1. public 폴더와 inidex파일, 그리고 src폴더 3.2. (함수형 컴포넌트를 클래스 방식 컴포넌트로 변경하기) 3.3. create-react-app의 기본 코드를 변경해보고 결과 확인하기 3.4. import된 파일들 - css파일과 컴포넌트들 4. 배포하기 4.1. 용량이 큰 create-react-app 4.2. build 하는 방법 4.3. 서버 제작과 bui.. 새로운 font 가져오기, 사용하기 본문 다음의 형식으로 폰트를 가져올 수 있다 @font-face{ src: url("../../../fonts/SF함박눈TTF.ttf"); font-family: "hambak"; /*다른 곳에서 사용할 때의 font-family 이름을 지정*/ } 다른 클래스에서 이용할 때 .font-hambak{ font-family: "hambak"; /*지정해둔 font-family 사용*/ } 사용자 지정 CSS 속성 (css 변수) 개요 CSS 저작자가 정의하는 개체로, 문서 전반적으로 재사용할 임의의 값을 담습니다. 사용자 지정 속성은 전용 표기법을 사용해 정의하고, (--main-color: black;) var() 함수를 사용해 접근할 수 있습니다. (color: var(--main-color);) 참고 https://developer.mozilla.org/ko/docs/Web/CSS/Using_CSS_custom_properties 사용자 지정 CSS 속성 사용하기 (변수) - CSS: Cascading Style Sheets | MDN 사용자 지정 속성(CSS 변수, 종속 변수)은 CSS 저작자가 정의하는 개체로, 문서 전반적으로 재사용할 임의의 값을 담습니다. 사용자 지정 속성은 전용 표기법을 사용해 정의하고, (--ma.. Typescript 문법 Types of typescript - 1 //**Alias 타입 = ? -> 값을 넣어도 되고 안 넣어도 됨 //**Type 값 미리 지정 -> 앞에 type이 붙은 Player가 이것 -> 생성한 타입은 변수명 뒤에 ': + 타입명' 식으로 사용해줌 type Player = { name : string, age? : number } const nico : Player = { name : "nico" } const lynn : Player = { name : "lynn", age : 12 } //구지 그럴 필요는 없지만 type을 아래와 같이 사용 가능 type Age = number; type Player2 ={ age? : Age; } //**함수의 return값 지정 (특히 return값으로 객체.. grid 문법 #garden { display: grid; grid-template-columns: 20% 20% 20% 20% 20%; grid-template-rows: 20% 20% 20% 20% 20%; } #water { grid-row : 3/ span 3 } #garden { display: grid; grid-template-columns: 20% 20% 20% 20% 20%; grid-template-rows: 20% 20% 20% 20% 20%; } #water { grid-column : 2 / -1; grid-row : 1 / -1; } grid-area은 /(슬래쉬)로 구분지어 grid-row-start, grid-column-start, grid-row-end, grid-column-end순으.. 생활코딩 - Python 문법(문법1과 통합예정) 개요 웹애플리케이션(이하 웹어플)을 만들며 Python의 문법과 사용법을 익혀봅시다. Python만으로 웹어플을 구현하기는 어렵기 때문에 Flask란 프레임 워크를 사용할 겁니다. 1강(개요) Python을 배워야 한다 근거1 웹 페이지 하나를 바꾸기는 쉽다. 그러나 동일한 형식의 웹 페이지 일 억개가 있다면 바꾸기 어렵다. 일괄 처리를 할 경우 바뀌면 안되는 파일도 변경될 소지가 있다. 근거2 또한 htdocs의 관리자만이 글을 추가할 수 있다. 사이트 주인이 아닌 사람이 글을 쓰기 위해선 Server프로그램(JSP, Python, PHP)이 필요하다 Python 작동원리 python의 확장자는 py이다. 이 파일은 웹서버가 처리할 수 없다. 따라서 아래의 방식으로 작동한다 웹서버 (CGI란 기능을 이.. gltfLoader에서 에러가 날 때 / type="module"을 사용할 때 개념 import할 때 three.js 스크립트 대신 'three.module.js'를 사용하면 오류가 나지 않는다. renderer에서 'renderer.outputEncoding = THREE.sRGBEncoding;' 을 입력하면 load한 모델의 색이 조명에 따라 변하지 않는다 gltf 오브젝트 출력하기 개념 three.js에서도 오브젝트를 만들 수 있지만, 3d max같은 프로그램에서 오브젝트를 만들어 그걸 출력하는 편이 좋다. 참고자료 //three.js에서 gltf 출력하기 https://velog.io/@9rganizedchaos/Three.js-journey-%EA%B0%95%EC%9D%98%EB%85%B8%ED%8A%B8-21 이전 1 2 3 4 ··· 10 다음