본문 바로가기

전체 글

(159)
[React] - Axios 1. Axios React 에서는 axios를 사용해서 GET , PUT, POST, DELETE 등의 메서드로 API 요청을 할 수 있다 GET은 데이터 조회 POST는 데이터 등록 PUT은 데이터 수정 DELETE는 데이터 제거의 의미를 갖고 있다 . 이외에도 HEAD, PATCH 와 같은 메서드들도 존재한다 2. Axios 기본 사용법 우선 yarn 또는 npm, npx로 axios패키지를 다운받고 위와 같이 사용하시면 됩니다 get은 데이터 조회를 하는 메서드이므로 저렇게만 적어도 상관없는데 만약 POST메서드를 사용하고 싶으시다면 다음과 같이 두번째 파라미터에 등록하고자 하는 정보를 넣을 수 있습니다 2. Axios 응답 스키마 axios는 요청에 따른 응답 결과를 받는데 이를 응답 스키마라고 ..
[프로젝트 회고] - 동그라미 1. 프로젝트 링크 https://github.com/modern-agile-team/dongurami-front GitHub - modern-agile-team/dongurami-front: 우아한애자일 2기 동그라미 (front repository) 우아한애자일 2기 동그라미 (front repository). Contribute to modern-agile-team/dongurami-front development by creating an account on GitHub. github.com *동그라미 서비스는 현재는 배포가 중단된 상태입니다 2. 기획 의도 코로나 19이후로 신입생 및 재학생들이 동아리에 관심은 많지만 교내에 어떤 동아리가 있는지 알기가 힘들어졌고 같은 이유로 동아리 회장들은 동..
[TypeScript] - 연산자를 이용한 타입 정의 1. 유니온 타입 유니온 타입(Union Type)이란 자바스크립트의 OR 연산자(||)와 같이 A이거나 B이다 라는 의미의 타입입니다. 아래 코드를 보겠습니다. function logText(text: string | number) { // ... } 위 함수의 파라미터 text에는 문자열 타입이나 숫자 타입이 모두 올 수 있습니다. 이처럼 | 연산자를 이용하여 타입을 여러 개 연결하는 방식을 유니온 타입 정의 방식이라고 부릅니다.
[TypeScript] - 인터페이스 (InterFace) 1. 인터페이스란 ? 인터페이스는 상호 간의 정의된 약속 혹은 규칙을 의미한다 타입스크립트의 인터페이스는 보통 다음과 같은 범주에 대해 약속을 정의할 수 있다 함수의 파라미터 객체의 스펙(속성과 속성의 타입) 함수의 스펙(파라미터, 반환 타입 등) 배열과 객체를 접근하는 방식 클래스 let person = { name: 'Capt', age: 28 }; function logAge(obj: { age: number }) { console.log(obj.age); // 28 } logAge(person); // 28 인터페이스에 대해 간단히 알아볼 수 있는 예제를 살펴보도록 하겠습니다 위 logAge() 함수에서 받는 인자의 형태는 age를 속성으로 갖는 객체입니다. 이렇게 인자를 받을 때 단순한 타입 뿐..
[TypeScript] - 타입스크립트의 기본 타입 타입스크립트로 변수나 함수같은 자바스크립트 코드에 타입을 정의할 수 있습니다 . 1. String let str: string = 'hi; 자바스크립트 변수의 타입이 문자열인 경우 위와 같이 선언해서 사용합니다. 2. Number let num: number = 2 타입이 숫자이면 위와 같이 선언해서 사용합니다. 3. Boolean let isLoggedIn: boolean = false; 타입이 진위 값인 경우에는 위와 같이 선언합니다. 4. Array let arr: number[] = [1,2,3]; 타입이 배열인 경우 간단하게 위와 같이 선언합니다. let arr: Array = [1,2,3]; 제네릭을 사용해서 이렇게 표현할 수도 있습니다. 5. Tuple 튜플은 배열의 길이가 고정되고 각 요소..
[TypeScript] - 타입스크립트란 ? 1. 타입스크립트 란? 타입스크립트는 자바스크립트에 타입을 부여한 언어이다 자바스크립트의 확장된 언어라고 볼 수 있다 타입스크립트는 자바스크립트와 달리 브라우저에서 실행하려면 파일을 한번 변환시켜 주어야 한다 이를 '컴파일'이라고 부른다. 2. Why Typescript ? 1) 에러의 사전 방지 function sum(a, b) { return a + b; } function sum(a: number, b: number) { return a + b; } 첫번째 코드는 자바스크립트로 작성한 코드이고 두번째 코드는 타입스크립트로 작성한 코드이다 둘다 두 숫자의 합을 구하는 코드이다. sum('10', '20'); // 1020 만약 첫번째 자바스크립트로 작성한 코드를 이용해 문자열 '10'과 '20'을 더..
프로그래머스[LEVEL 1] - 최소직사각형 https://programmers.co.kr/learn/courses/30/lessons/86491 코딩테스트 연습 - 최소직사각형 [[10, 7], [12, 3], [8, 15], [14, 7], [5, 15]] 120 [[14, 4], [19, 6], [6, 16], [18, 7], [7, 11]] 133 programmers.co.kr 간단한 문제다 size 요소 배열들을 내림 차순으로 정렬 한 다음 가로에서 가장 큰 값과 세로에서 가장 큰 값을 구해 곱하는 방식으로 해결했다
프로그래머스[LEVEL 1] - 신고결과 받기 ("2022 카카오 블라인드 코딩테스트") https://programmers.co.kr/learn/courses/30/lessons/92334 코딩테스트 연습 - 신고 결과 받기 문제 설명 신입사원 무지는 게시판 불량 이용자를 신고하고 처리 결과를 메일로 발송하는 시스템을 개발하려 합니다. 무지가 개발하려는 시스템은 다음과 같습니다. 각 유저는 한 번에 한 명의 programmers.co.kr 먼저 첫번째 풀이다 풀이 자체는 결과는 맞게 나오는 것 같지만 시간 초과가 나온 풀이다 다음은 두번째 풀이다 첫번째 풀이에서 시간초과가 나오는 바람에 좀더 객체를 적극적으로 이용해서 해결하려고 했다 아직 코드를 효율적으로 짜는 법을 많이 모르는 것 같다 무작정 반복문을 이용해서 하드코딩을 하는 경우가 많은것 같다 이번 문제에서도 사실 객체를 잘 쓰면 좀더..