분류 전체보기

[리액트] 컴포넌트 단축키 깡패 rafce

리액트의 최고 장점, 컴포넌트라는 개념은 개발자가 원하는글 묶어서 태그화(컴포넌트)화 시킬 수 있다는 것이다. Box.js로 작명한 js 파일에 rafce 작성 후 엔터치면! import React from 'react' const box = () => { return ( ) } export default box 위와 같은 템플릿이 바로 만들어진다. 컴포넌트 만들 시 주의 사항: 컴포넌트 이름은 반드시 대문자로 시작해야 한다. 이는 리액트가 컴퓨넌트와 일반 html 태그를 구별하는 방법이 대묹바로 시작하는지 여부를 검토하기 때문이다. 1. 반복되는 아이템 2. 기능별 아이템(테스트, 유지보수 용이) 3. 나중에 재활용될 것으로 예상되는 기능 \first-react\src\App.js import "./A..

[타입스크립트] 골뱅이 @ 데코레이터

https://m.blog.naver.com/pjt3591oo/222120496022 [typescript] 타입스크립트 데코레이터 1편 - 데코레이터 4가지 기본구조 알아보기 안녕하세요. 멍개입니다 이번글에서는 타입스크립트에서 지원하는 데코레이터의 기본구조를 알아보겠습니다... blog.naver.com https://sleepybird.tistory.com/158 [199일차]타입스크립트 데코레이터 Reference 🗂공식문서 타입스크립트 데코레이터 네스트나 앵귤러같은 프레임워크를 마주하다보면 심심치않게 볼수있는녀석이 있다. 바로 이 골뱅이가 붙어진 '데코레이터' 라고 불리는 녀석이다 sleepybird.tistory.com 골뱅이가 붙어진 '데코레이터' 라고 불리는 녀석 타입스크립트에만 있는건 아니..

[aws] EC2 인스턴스 종료 및 탄력적 ip 주소 릴리즈(제거)

https://codingbuza.tistory.com/entry/AWS%EC%97%90%EC%84%9C-%EA%B0%91%EC%9E%90%EA%B8%B0-%EC%B2%AD%EA%B5%AC%EC%84%9C%EA%B0%80-%EB%82%A0%EC%95%84%EC%99%94%EC%9D%84-%EB%95%8C-%ED%95%B4%EA%B2%B0-%EB%B0%A9%EB%B2%95 AWS에서 갑자기 청구서가 날아왔을 때 해결 방법 1. 서론 - 아마존에서 청구서가 날아왔어요 2. 프리티어를 사용했는데 사용료를 내야 하는 이유 3. EC2 인스턴스 종료 및 탄력적 ip 주소 릴리즈(제거) 4. 청구 비용 알림 설정 5. 후기 (feat. 글 다 써 codingbuza.tistory.com https://brunch...

[자바스크립트] 익명함수, 화살표 함수, 콜백함수

let onComplete = () => { console.log('동막골'); }; class Welcome { to(onComplete) { onComplete(); } } const welcome = new Welcome(); welcome.to(onComplete); //동막골 익명함수 형식 ) var(혹은 let) 변수명 = function(매개변수명 : 자료형) { 처리구문 } 변수가 함수의 이름을 대신하게 되고, 이 변수를 사용해서 함수의 기능을 실행할 수 있다. 자바스크립트, 함수를 만들때 사용하는 일반적인 방법 var pow_ = function(x:number){ //function pow_(x:number) console.log('x=>'+x); return x*x; } console..

[자바스크립트] crazy this, 헷갈리는 자바스크립트 this 예제 총정리

https://poiemaweb.com/es6-arrow-function Arrow function | PoiemaWeb Arrow function(화살표 함수)은 function 키워드 대신 화살표(=>)를 사용하여 간략한 방법으로 함수를 선언할 수 있다. 하지만 모든 경우 사용할 수 있는 것은 아니다. 문법은 아래와 같다. poiemaweb.com ㄴ> 가장 정확하고 자세하고 풍부한 예시로 설명되어 있는 문서 const obj = { name: '꼬부기', sayName: () => { console.log(this.name); } } obj.sayName(); class Counter { name = 'counter'; count = 0; increase = () => { console.log(th..

[타입스크립트 예제] 정규 표현식 regex, 유튜브에서 id값만 추출해서 EMBED 해보기

https://youtu.be/t3M6toIflyQ 개발자라면 정규표현식은 꼭 쓰게되기 때문에 하루 날 잡고, 알아두는 것이 좋음 *엘리님 영상을 보고 학습한 포스팅입니다. 어떻게 원하는 패턴을 작성해나가는지가 중요 포인트이다. 📓 영상에서 언급된 자료들 깃허브 정리 ⇢ https://github.com/dream-ellie/regex RegexOne(퀴즈) ⇢ https://regexone.com/ GitHub - dream-ellie/regex Contribute to dream-ellie/regex development by creating an account on GitHub. github.com RegexOne - Learn Regular Expressions - Lesson 1: An Intr..

[자바스크립트] export default

https://ko.javascript.info/import-export#ref-4122 모듈 내보내고 가져오기 ko.javascript.info 모듈은 크게 두 종류로 나뉩니다. 복수의 함수가 있는 라이브러리 형태의 모듈(위 예시의 say.js) 개체 하나만 선언되어있는 모듈(아래의 user.js. class User 하나만 내보내기 함) 대개는 두 번째 방식으로 모듈을 만드는 걸 선호하기 때문에 함수, 클래스, 변수 등의 개체는 전용 모듈 안에 구현됩니다. 그런데 이렇게 모듈을 만들다 보면 자연스레 파일 개수가 많아질 수밖에 없습니다. 그렇더라도 모듈 이름을 잘 지어주고, 폴더에 파일을 잘 나눠 프로젝트를 구성하면 코드 탐색이 어렵지 않으므로 이는 전혀 문제가 되지 않습니다. 모듈은 export de..

[Java IDE] eclipse IDE 스타일 변경하기

[Eclipse] 이클립스 인터페이스 세팅하기 (Black 테마, Marketplace, 개발용 폰트 추천) (tistory.com) [Eclipse] 이클립스 인터페이스 세팅하기 (Black 테마, Marketplace, 개발용 폰트 추천) 이클립스 테마 변경 1. [Windows] > [Preference] 2. [General] > [Appearance] > Theme 선택 (default: Light) 3. Theme : 'Dark' 변경 모습 다만, 이클립스 기본 Dark 테마는 배경이 회색톤에, 에디터 폰트.. bada744.tistory.com

[Node.js] 모듈 (export, require)

- package.json 에 "type": "module", 추가해줄 것 - export 키워드 사용 - import {가져올이름1, 가져올이름2 . . . } from '경로지정' - 한꺼번에 : import * as 가져올이름 from "경로지정"; 써준다음에 가져올이름.가져올함수명() 이런식으로 부름 counter.js let count = 0; function increase() { return count++; } function getCount() { return count; } module.exports.getCount = getCount; module.exports.increase = increase; 위 코드와 동일 기능 let count = 0; function increase() { ..

웹페이지 아이콘 변경하기

폴더 만들어서 이미지 파일 넣고 헤드 안에 위와 같이 작성해주면 된다!