📌 목차 변수 타입 참고 📌 변수와 상수 var let var은 변수이다 let은 상수이다 var str1 = "hello world" let str2 = "hello world2"📌 타입 Int(64bit 정수형) -> type cast Int() Double (64bit 부동 소수점) -> type cast Double() Float (32bit 부동 소수점) -> type cast Float() Bool -> type cast Bool String -> type cast String Character -> type cast Character 여기서 한가지 신기한건 똑같이 ""을 쓴다는 것 입니다. let char : Character = "A" Any 모든 타입을 지칭하는 키워드 📌 참고 Swift..
📌 목차 서론 Vue SSR의 기본적인 설명 코드 설명 결론 참고 자료 📌 서론 안녕하세요. 이번에 라이엇 프로젝트가 vue를 커스터마이징하여 ssr을 구현하여 client only의 컴포넌트가 없었습니다. 따라서 필요에 따라 컴포넌트 전체의 랜더링 시점을 결정하는 Nuxt에서의 컴포넌트를 만들게 되었습니다. 그에 따라 이글에서는 사용방법 및 구현 방식을 설명하고자 합니다. 💡 Nuxt에서 client-only 컴포넌트란? ClientOnly 컴포넌트는 자식요소들을 client-side에서 랜더링 시킵니다. 📌 Vue SSR의 기본적인 설명 일단 해당 컴포넌트에 대해서 조금 더 깊게 이해를 하자면 먼저 customized vue ssr부분을 먼저 이해를 해야합니다. 보통 SSR일때는 server에서 데이..
📌 목차 서론 usedExport 나라 탐방 devtool 무기 획득 webpack-bundle-analyzer 세계 지도 획득 Element-UI 나라와의 전쟁 그리고 패배… Lottie.js 나라와의 전쟁 결론 📌 서론 안녕하세요. 회사에서 빌드 타임이 길어져 많은 비용이 발생하고 있었습니다. 이 문제를 한번 해결을 해보고 싶었습니다. main 프로젝트에서 build 최적화를 시키는데 기승전결의 형식으로 재밌게 풀어나가보려고 합니다. 그럼 재밌게 읽어주세요! (피드백도 너무나 환영합니다. ) 그럼 출발 ! 🚀 📌 usedExport 💡 사용되지 않는 코드들이 build가 되는 모습을 보았고 나는 그걸 없애고 싶었습니다. 출근을 하여 들뜬 마음으로 build가 된 main.js를 읽고 있었을때 였습니다..
📌 목차 서론 설치 간단한 구현 graphql playground 결론 참고 📌 서론 얄코님의 강의를 정리한 내용들 입니다. 해당 강의는 apollo server와 react를 연결하는 부분을 구현합니다. 그럼 먼저 apollo-server를 설치해볼까요? 📌 설치 먼저 graphlql과 apollo-server를 설치해볼까요? npm install graphql apollo-server 📌 간단한 구현 const database = require('./database'); const { ApolloServer, gql } = require('apollo-server'); // 타입을 선언 합니다. const typeDefs = gql` type Query { teams: [..
📌 목록 Introudction Hover Active Focus First child Last child nth child nth of type not before after 속성 선택자 상속 우선 순위 Conclusion 📌 Introduction 안녕하세요. 오늘은 css에서의 가상클래스 선택자에 대해서 알아보겠습니다. :로 표시하게 됩니다. ::랑 헷갈리지 마세요! 📌 Hover 마우스 포인터가 올라가 있는 동안에만 선택이 됩니다. HELLO 📌 Focus 포커스 된 동안에만 선택이 됩니다. HELLO 📌 First child 요소가 형제 요소 중 첫번째 요소라면 선택 pear lemon orange 📌 Last child 요소가 형제 요소 중 가장 마지막 요소 선택 pear lemon orang..
📌 목록 Introduction 문자열, 숫자, 배열 튜플, 객체, 진위값 함수 타입 - 파라미터, 반환 값 함수 타입 - 옵셔널 파라미터 Conclusion 📌 Introduction 안녕하세요. 오늘은 typescript의 기본중의 기본 타입정의하기에 대해서 알아보겠습니다. 기본적으로 변수의 타입과 함수의 타입에 대해서 알아보겠습니다! 📌 문자열, 숫자, 배열 기본적으로 변수명 다음에 : 을 붙이고 그뒤에 타입을 적어주면 됩니다. // string 타입 정의 const str: string = 'HELLO'; // number 타입 정의 const num: number = 1; // array 타입정의 의 두가지 방법 // 1. const numArr: Array = [1, 2, 3];..
📌 목차 Introduction 일치 선택자 자식 선택자 후손 선택자 인접 형제 선택자 일반 형제 선택자 Conclusion 📌 Introduction 📌 일치 선택자 모두 만족하는 선택자 (띄워쓰기가 없다는 것을 유의!🚨) span.orange{ color: red; } apple pear orange carrot tomato orange 여기서 span과 class="orange"에 해당 하는 것만 color: red로 표시가 됩니다. 📌 자식 선택자 어떤 것의 자손만 선택하는 선택자입니다. ul > .orange{ color: red; } apple pear orange carrot tomato orange ul의 자손중 orange class인것만 선택하게 됩니다. 📌 후손 선택자 후손 선택자는 ..
📌 목차 Introuduction d3.interval Update pattern Conclusion 📌Introduction 안녕하세요. 오늘은 D3에서의 update pattern에 대해서 알아보겠습니다. 📌 d3.interval update pattern으로 들어가기 전에 잠시 d3의 interval에 대해서 소개할까 합니다. d3.interval은 setInterval과 매우 비슷합니다. 단 clearInterval은 안해줘도 된다는 장점이 있어요. d3.interval(() => { console.log("hello") // hello가 1초에 한번씩 찍힘 }, 1000); 📌 Update pattern update패턴은 data join부터 시작이 됩니다. const rects = g.sele..
