728x90 전체 글89 [스타이퍼팩토리] 2일차(2)_리액트 돔(DOM), 컴포넌트, JSX, CSS 스타일링 1. 리액트 프로젝트 생성 -npx//설치npx create-react-app my-app//실행npm run start - npmnpm install -g creact-react-appcreate-react-app my-app - vite최근에는 npx, npm보다 vite를 사용해서 프로젝트를 생성하는게 주목받고 있다.//설치npm create vite@latest //실행npm run dev 다음으로, React와 TypeScript+SWC를 선택해주면 된다. 2. 돔(DOM)과 가상돔(Virtual DOM)돔(DOM)DOM(Document Object Model)은 문서 객체 모델을 의미한다. 이때 문서 객체란 html, head, body와 같은 태그들을 javascript가 이용할 수 있는 .. 2024. 9. 24. [스나이퍼팩토리] 2일차(1)_타입 오퍼레이터, Enum, 제네릭 1. 타입 오퍼레이터유니언 타입 (|) -> OR인터섹션 타입 (&) -> AND 유니언 타입유니언 타입은 연결된 타입 중 1개만 만족하면 된다.const returnValue=(value:string|number|boolean)=> value;console.log(returnValue("A"));console.log(returnValue(10));console.log(returnValue(true)); 함수 오버로드.유니언 타입 사용 시, 함수 내부에서 유니온 타입의 매개 변수를 사용하면 타입을 좁혀주는 과정이 필요하다. 많은 경우의 수가 발생하여 오류가 발생할 수 있기 때문이다. 이때, typeof, instanceof 를 사용해서 좁혀준다.const add=(n1:number|string, n2:.. 2024. 9. 23. [스타이퍼팩토리] 1일차_타입스크립트 기본&함수 타입 타입스크립트는 자바스크립트의 확장 언어이다. 즉, 자바스크립트에서 다루는 값에 타입을 부여하는 것이다. 1. 기본 타입stringnumberbooleanobjectArray (대문자 주의)tupleanynullundefined 기본 자료형let str:string="A"; //기본 타입let str2:String="A"; //String이라는 인스턴스 객체let num:number=10; //기본 타입let num2:Number=10; //Number라는 인스턴스 객체let bol:boolean=true;let und:undefined=undefined;let nul:null=null;let sym:symbol=Symbol(); 배열Array 타입은 배열 타입, tuple 타입은 특정 형태를 갖는 .. 2024. 9. 22. 포트폴리오 모음 1. 교내/교외의 경로 및 시설 안내 어플기간 : 2023년 4월 ~ 7월포지션 : 기획, 설문, 피그마배운 점 : 프로젝트를 통해 사용자 요구를 반영하는 기획의 중요성을 실감했고, 기술적 문제 해결에 있어서 깊이 있는 사고가 필요하다는 것을 배웠다. 특히, 설문 조사를 통해 사용자의 진짜 필요를 파악하는 것이 얼마나 중요한지 깨달았고, 이를 바탕으로 어플을 설계하는 과정이 매우 의미 있었다. 또한, 피그마를 활용해 팀원들과 디자인 작업을 진행하면서, 서로의 아이디어를 조율하고 협력하는 과정에서 팀워크의 가치를 체감했다. 이러한 경험은 앞으로의 개발 프로젝트에서도 팀 협업의 중요성을 염두에 두고, 사용자 중심의 접근 방식을 계속해서 적용하는 데 큰 도움이 될 것이라고 생각한다. 2. IT 사이드 프로젝.. 2024. 8. 25. 이전 1 2 3 4 ··· 23 다음 728x90
