일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- API
- 최적화
- 우아한테코톡
- next.js
- CSS
- 함수
- ES5+
- object
- 선택자
- dev
- 햇소
- developerlife
- 변수
- learn next.js
- git
- gitCLI
- es6
- This
- array
- JS
- github
- hatso
- JavaScript
- DOM
- hooks
- AI
- ES6+
- Python
- html5
- react
- Today
- Total
목록dev (5)
codinghatso

react를 사용해서 개인적으로 하는 첫 프로젝트입니다. react 공문서를 학습하고, 이해하기 힘들거나 정보가 마음에 안 들 때는 ChatGPT를 활용해서 학습했습니다. 그리고 글이 맥락이 없을 것입니다. 개발하면서 생각나는 대로 끄적이는 낙서장이니 가볍게 구경하고 가시면 될 것 같습니다. 감사합니다. 1. flexbox 같은 css 기능이 왜 적용이 안 되지? react로 개발을 하면서 javascript를 사용하듯이 개발하면 여러 문제를 만나는 것 같습니다. css에서 직접 사용 /* YourComponent.css */ .flex-container { display: flex; /* 다양한 Flexbox 속성을 여기에 추가하세요 */ } /* 각각의 Flex Item에 대한 스타일 */ .flex..

"javascript에서 this는 함수를 호출한 객체이다" 전역에서 this 호출 시 window객체를 가리킨다. function main(){ console.log(this); } main(); //와 window.main()은 같다. //window객체를 가리킨다. 'use strict'를 사용하면 함수를 호출한 객체를 명시하지 않으면 undefined 값을 반환한다. const object = { name: 'hatso', main: function() { console.log(this); }, }; object.main(); //이렇게 하면 main함수를 호출한 object객체를 this가 가리킨다. //만약 const main2 = object.main; //main2(); //이렇게 호출한다..

함수 선언식 function main(){ console.log('hello'); } 호이스팅 O 익명함수 사용 X 매개변수를 명시하지 않아도 arguments 변수로 인자를 할당 O 함수 표현식 const main = function() { console.log('hello'); } main(); 호이스팅 X 익명함수 사용 O 매개변수를 명시 하지 않아도 arguments 변수로 인자를 할당 O 화살표 함수 const main = () => { console.log('hello'); } main(); 화살표 함수는 익명함수 때문에 표현식에 사용됨 매개변수를 명시해야 합니다. arguments 변수로 자동 할당 X const main = (...args) => { console.log(args); } m..

Emmet 기본 내장 기능 활용 팁. emmet 문법 정리 div.class div#id div>ul>li 자식 div>ul+ol 형제 ul>li*5 반복 div>ul>li^ol 부모 div>(header>ul>li*2>a)+footer>p 그룹 tip1. ol>li*3 -ol 태그 안에 li태그를 3개 생성하는 기능이 있습니다. // ol>li*3 --result tip2. div.container>div.item.item${$}*10 -div태그 안에 class="container"를 부여하고 그 자식으로 div태그 안에 class="item item$(순차적 숫자)" {$(순차적 숫자)}컨텐츠를 *10 열번 생성합니다. // div.container>div.item.item${$}*10 --resu..

git command language를 표로 정리해 보았습니다. 공부를 하면서 새로운 명령어를 알아내면 계속 추가할 예정입니다. 우리 모두 협업 가능한 인재가 되도록 노력해 봅시다!! Command language explanation 보충설명 git init initialize repository 리포지토리 초기화 .git git repository git 저장소 git status working tree status git 상태확인 git add add to staging area staging area에 추가 git add . . refers to all files in the current directory 현 directory의 모든 파일 git commit create version 버전 만들..