본문 바로가기

Programming8

react.js 입문 - extensions > exlint : 잘못된 문법 검사rules: { 'react/jsx-no-target-blank': 'off', 'react-refresh/only-export-components': [ 'warn', { allowConstantExport: true }, ], 'no-unused-vars':"off", //추가 'react/prop-types':"off", //추가 },.eslintrc.cjs[react component] 리액트 컴포넌트- 컴포넌트 함수를 만들때에 함수 이름 첫글자는 대문자여야함!JSX : 확장된 자바스크립트의 문법을 말함- javascript와 html을 혼용해서 사용JSX 주의사항1. 중괄호 내부에는 자바스크.. 2025. 5. 7.
react.js 개론 [react.js]- 오픈소스 javascript 라이브러리- 대규모 웹 서비스의 UI를 더 편하게 개발하기 위해 만들어진 기술컴포넌트를 기반으로 UI를 표현한다- 여러페이지에서 공통으로 사용하는 부분을 컴포넌트화- 유지보수 용이, 중복코드를 줄임화면 업데이트 구현이 쉽다- 선언형 프로그래밍(react) : 목적만 깔끔하게 명시, 코드가 간결함화면 업데이트가 빠르게 처리된다- 동시에 발생한 업데이트를 모아서 한번에 수정- virtual DOM : DOM을 복제- react는 업데이트가 발생하면 실제 DOM을 수정하기 전에 가상의 복제판 DOM에 먼저 반영[react App 생성하기]Vite : 차세대 프론트엔드 개발 툴- 기본 설정이 적용된 React App 생성 가능//터미널> npm create vi.. 2025. 5. 7.
자바스크립트 - 심화 [01] Truthy와 Falsyjavascript 에서는 참, 거짓이 아닌 값도 참, 거짓으로 평가한다.Truthy : 참 같은 값Falsy : 거짓 같은 값→ 이를 이용하면 조건문을 간결하게 만들 수 있음.// 1. Falsy한 값let f1 = undefined;let f2 = null;let f3 = 0;let f4 = -0;let f5 = NaN;let f6 = "";let f7 = 0n;// 2. Trusy한 값// -> 7가지의 falsy한 값을 제외한 나머지 모든 값let t1 = "hello";let t2 = 123;let t3 = [];let t4 = ();let t5 = () => ();// 3. 활용 사례function printName(person) { // undefined 또는.. 2025. 3. 14.
자바스크립트 - 기본 [01]javscript: 인터프리터 언어(바로실행), 컴파일을 거치지 않음.- 버그가 덜 걸러지고, 실행이 조금 느리다는 단점이 있음.- 객체 지향, 프로토타입 기반..[02]변수와 상수- 데이터에 의미 부여- var (예전 자바스크립트 버전에서 사용. 오늘날에는 사용하지 x)- ES6 부터는 let, const 사용!!- 자바스크립트는 데이터의 종류에 있어 엄격하지 않음. (하나의 주머니에 텍스트, 숫자, 배열 등 담아도 됨)- 이미 만든 상수와 같은 이름의 상수를 다시 만들 수 없음.(브라우저 콘솔 예외)let : 변수- 넣은 데이터를 바꿀 수 있음const : 상수- 넣은 데이터를 바꿀 수 없음- 상수는 선언만 할 수 없음. 데이터를 넣어줘야함변수 명명 규칙- $나 _ 제외하고는 사용하지 않아야한.. 2025. 3. 14.