반응형 취미 공부/Daily53 Daily Coding - FE 2주차 - 22강 22강export default Toast; 뿐 아니라 하기와 같은 Named export 방식으로도 import가 가능하다Toast.jsconst hello = 10.const world = 20;export {hello, world}App.jsimport Toast, {hello, world} from './components/Toast'; PATH./ 이 안붙어 있는 아이들은 모두 라이브러리로 설치 후 사용이 가능함./ => 하위 디렉토리 경로../ => 상위 디렉토리 경로 2024. 9. 22. Daily Coding - FE 2주차 - 21강 21강객체 리터럴 **객체 리터럴 (Object Literal)**은 자바스크립트에서 객체를 생성하는 가장 간단한 방법 중 하나입니다. 중괄호 {}를 사용해 직접 속성(key)과 값(value)을 쌍으로 나열하는 방식입니다. 예시)const obj = {key1: value1,key2: value2,key3: value3 }; const person = {name: 'Alice',age: 25,greet: function() { console.log('Hello!'); } }; 객체 리터럴의 장점1. 간결함: 객체를 빠르게 생성할 수 있음.2. 읽기 쉬움: 코드가 직관적이고 가독성이 좋음.3. 바로 사용 가능: 별도의 생성자 함수 없이 객체를 즉시 정의하고 사용할 수 있음.// App.js 파일 내용im.. 2024. 9. 19. Daily Coding - FE 2주차 - 20강 추가 공부 ==================== ! 강의 내용 ! ====================20강props: Properties 의 약자: 함수에 매개변수를 넣는 것처럼 컴포넌트에 전달하는 값: 값을 지닌 존재 // method '함수'!쉽게 말하면 값을 함수에 담아서 전달하는 거라고 생각하면 됨! ex)const num = 10; 이라는 변수를 만든다 {props.num} 실제 예제)// App.js 파일 내용import logo from './logo.svg';import './App.css';import Toast from './components/Toast';function App() { const messageArray = [ { title : 'success', .. 2024. 9. 11. Daily Coding - FE 2주차 - 19강 20강 ==================== ! 강의 내용 ! ====================19강BEM 네이밍 규칙: Block Element Modifier: 3가지 단계로 CSS의 네이밍을 가져간다: 소문자 + 숫자로만 조합: 조합은 하이픈(-)으로 연결하여 작명한다 : 네이밍 조합은 '형태 > 의미 > 순서_상태' 를 기본 순서로 사용한다ex) btn_cancel_01_off => '형태_의미_순서_상태' // 옳은 예 cancel_btn_off_01 => '의미_형태_상태_순서' // 잘못 된 예 : 네이밍 조합의 _ 는 파일, 폴더, 이미지 등에 사용한다ex) customerService // 잘못 된 예 customer_service // 옳은 예 CSS 적용하는 여러가.. 2024. 9. 10. 이전 1 2 3 4 5 6 ··· 14 다음 반응형
