오늘도 코딩하나

강의 내용 : 강의 링크 #4.0 ~ #4.8 ○ browserRouterimport { BrowserRouter } from "react-router-dom";import Header from "./component/Header";import { Routes, Route } from "react-router-dom";import Home from "./screen/Home";import About from "./screen/About";function Router() { return ( } /> } /> );}export default Router;App.js에서 Router import해서 사용 ○ createBrowserRo..

강의 내용 : 강의 링크 #3.0 ~ #3.7 ○ Interface   ※ interface : object shape을 TypeScript에게 설명해준다.    * Prop Types는 prop이 거기에 있는지 없는지 확인해주지만, 코드를 실행한 "후"에만 확인 가능하다.   * 하지만 우리는 TypeScript처럼 코드 실행 "전"에 확인 하고싶다!!   * 그래서 우리는 Prop Types를 사용하지 않고, prop들을 Typescript로 보호해줄거다!     ⇒ Interface - Circle.tsximport { styled } from "styled-components";interface ContainerProps { bgColor: string;}const Container = styl..

강의 내용 요약 : 강의 링크 #2.0 ~ #2.7 ○ styled-componentimport styled from "styled-components";const Father = styled.div` display: flex;`;const Box = styled.div` background-color: ${(props) => props.bgColor}; width: 100px; height: 100px;`;const Circle = styled(Box)` border-radius: 50px;`;function App() { return ( );}export default App;style과 구현 부분으로 나누어지고, 구현 부분은 훨씬 가독성이 좋아진다.b..

Typescript ChallengeDictionary add : 새로운 단어와 그에 대한 정의를 추가한다get : 입력된 단어에 대한 정의를 반환한다.delete : 사전에서 특정 단어를 삭제한다.update : 기존 단어의 정의를 새로운 정의로 업데이트한다.showAll : 사전의 모든 단어와 정의를 출력한다.count : 사전에 저장된 단어의 총 개수를 반환한다.upsert : 단어가 존재하면 업데이트하고, 존재하지 않으면 추가한다.exists : 특정 단어가 사전에 존재하는지 여부를 반환한다.bulkAdd : 여러 단어와 정의를 한 번에 추가한다.bulkDelete : 여러 단어를 한 번에 삭제한다.type Word = { term:string; definition:string;}type W..

https://nomadcoders.co/typescript-for-beginners 타입스크립트로 블록체인 만들기 – 노마드 코더 Nomad CodersTypescript for Beginnersnomadcoders.co 강의 내용#4.2 ~ #4.5  🤷‍♀️ public이지만 더 이상 변경할 수 없도록 만들 수 없을까?class Word { constructor ( public readonly term:string, public readonly def :string ) {}}  ⇒ readonly○ static   ※ static : 클래스의 인스턴스가 아니라 클래스 자체에 속하는 메소드type Words = { [key:string]: string}cla..

https://nomadcoders.co/typescript-for-beginners 타입스크립트로 블록체인 만들기 – 노마드 코더 Nomad CodersTypescript for Beginnersnomadcoders.co 강의 내용#4.0 ~ #4.1 ○ Classclass Player { constructor( private firstName:string, private lastName:string, public nickname:string ) { }}const tistory = new Player("코딩하나", "오늘도", "tistory");// Property 'firstName' is private and only accessible withi..

https://nomadcoders.co/typescript-for-beginners 타입스크립트로 블록체인 만들기 – 노마드 코더 Nomad CodersTypescript for Beginnersnomadcoders.co  강의 내용 요약#3.0 ~ #3.4 ○ Typescript 함수1️⃣ call signatures우리가 Typescript에게 이 함수가 어떻게 호출되는지, 함수의 반환 타입은 뭔지 설명해주는 부분2️⃣ overloading 함수가 서로 다른 여러개의 call signatures를 가지고 있을 때 발생시킨다.간단히 생각해서 overloading은 여러 call signatures가 있는 함수일 뿐이다.type SuperPrint = { (arr: number[]):void ..

✅ 아래 해시에 대한 설명은 자바스크립트를 기반으로 합니다.해시 (Hash)key : value 자료구조전화번호 같은거라고 생각하면 됨해시 사용빠른 검색과 key : value 쌍 저장을 지원하는 자료구조1️⃣ Map순서 보장 : 삽입된 순서대로 순회 가능모든 데이터 타입을 키로 사용 가능빠른 검색 성능을 제공중복된 키는 덮어쓰기 가능2️⃣ Object문자열 또는 심볼만 키로 사용 가능프로토타입 상속이 포함됨성능 : Map보다 약간 떨어질 수 있음중복된 키는 덮어쓰기 가능3️⃣ Set중복 없는 값만 저장값에 대한 검색과 추가가 효율적순서 보장 : 삽입 순서대로 값 순회 가능특성MapObjectSet저장 형식키-값 쌍 (key-value pairs)키-값 쌍 (key-value pairs)값만 저장 (va..