
[React] Github API를 이용하여 자동 팔로우 기능 만들기
2022. 10. 22. 20:25
프로그래밍/React
🔧 삽질 기록입니다. 🔨 프로그래머스 데브코스 프론트엔드 3기에 합류하고 벌써 일주일이 지났네요. 깃허브에서 3기 분들 35명을 일일이 팔로우하다가 한 번에 팔로우 해주는 프로그램을 한 번 만들어봐야 겠다는 생각이 들었습니다. 아래는 완성본입니다. 깃허브 API 깃허브 REST API 공식 문서입니다. GitHub REST API - GitHub Docs To create integrations, retrieve data, and automate your workflows, build with the GitHub REST API. docs.github.com Users 문서의 user 리스트, user 정보, 팔로워 가져오기 등의 API를 postman으로 확인했습니다. 아래는 user의 정보를 가져오는..

[TS] 제네릭 / 유틸리티 타입
2022. 7. 6. 05:16
프로그래밍/TypeScript
1. 제네릭 제네릭을 이용하면 클래스나 함수, 인터페이스를 다양한 타입으로 재사용 할 수 있다. 선언할 때는 타입 파라미터만 적어주고 생성하는 시점에 사용하는 타입을 결정한다. 매개변수의 타입이 바뀌었는데 동일한 함수를 재사용하고 싶다면 함수 오버로드를 사용하거나 유니언 타입을 사용할 수 있다. 다른 타입들도 배열로 만들어서 전달 할 경우 아래와 같아진다. 이럴 때 사용할 수 있는 것이 제네릭이다. 사이의 타입 파라미터 T는 타입을 전달 받아 함수에서 사용할 수 있게 해준다. 함수 호출시 타입을 기입해주지 않아도 타입 스크립트는 전달되는 매개변수를 보고 어떤 타입인지 알고 있다. 혹은 옵션 객체의 모습이 정해져 있다면 아래와 같이 작성할 수 있다. showName 함수는 매개변수를 받아서 그 객체의 na..

[TS] 함수 / 리터럴, 유니온, 교차 타입 / 클래스
2022. 7. 5. 19:57
프로그래밍/TypeScript
· 1. 함수 함수 타입 정의는 다음과 같이 한다. function add(num1: number, num2: number): number { return num1 + num2; } function add(num1: number, num2: number): void { console.log(num1 + num2); } function isAdult(age: number): boolean { return age > 19; } 인터페이스처럼 함수의 매개변수도 옵셔널로 지정할 수 있다. name이 있으면 name을 쓰고 없으면 world를 출력하게 하는 코드다. 하지만 호출할 때 매개변수가 없어서 빨간 줄이 나타났다. name이 없을 때의 코드가 있지만 타입스크립트에서는 보다 명시적으로 알려줘야 한다. 아래와..

[TS] 타입스크립트 사용 이유 / 기본 타입 / 인터페이스
2022. 7. 5. 01:18
프로그래밍/TypeScript
※ 브라우저들은 타입스크립트를 이해하지 못하기 때문에 타입스크립트를 자바스크립트로 변환해서 로드해야 실행 가능 1. 타입스크립트를 사용하는 이유 // 자바스크립트 코드 function add(num1, num2) { console.log(num1 + num2); } add(); add(1); add(1,2); add(3,4,5); add('hello', 'world'); 더보기 NaN NaN 3 7 "helloworld" add(1,2)를 제외하고는 원하는 결과가 나오지 않는다. add()의 경우에는 아무 인수도 전달하지 않았으니까 num1과 num2 모두 undefined가 되었고, undefined끼리 더했으니 NaN이 나온다. 하지만 자바스크립트는 아무런 경고도 주지 않았고, 실수가 분명함에도 심지..