
자바스크립트 풀스택 개발자
IT/개발
생성 : 2024.03.05
스터디 소개
자바스크립트 개발자 취업준비생 스터디
- 전체(21)
- JavaScript(4)
- React/Vue(2)
- Node.js/DB(9)
- AWS/클라우드서비스(1)
- TypeScript(1)
- 기타(3)
- 💟 코딩테스트(1)
자바스크립트 풀스택 개발자 이달의 인기 포스트
- Node.js/DB[NestJS] 요청에서 withCredentials 사용할 때 서버에서 origin을 와일드카드(*)로 사용하면 안 됨프론트엔드 요청에서 'withCredentials'를 사용할 때, 서버에서 origin을 '*' (와일드카드)로 모든 origin을 허용하게 되면 에러가 난다. 프론트엔드 코드 버튼을 누르면 다음과 같은 post 요청이 가도록 하였다. NestJS 서버에서는 enableCors에서 origin을 '*'로 한 상태이다. 오류 내용 Access to XMLHttpRequest at 'http://localhost:3000/auth/sign-in' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.라면과구공탄2024.06.0610
- Node.js/DB[NestJS] res.cookie를 사용하기 위해 Express의 Response를 import 해야함프로젝트 리팩토링을 하고 있는데, Access token은 리스폰스의 리턴값으로 보내주고, Refresh token은 쿠키에 담아서 전송하기로 하였다. res.cookie를 사용하기 위해 Express의 Response를 import NestJS에서 Request와 Response 객체를 사용하는 방법은 두 가지가 있다. 1) Express로부터 직접 가져온다 2) NestJS의 @nestjs/common에서 가져온다 VSCode에서 자동 import를 설정해 놓으면 NestJS의 @nestjs/common에서 가져오게 된다. 그런데 쿠키 전송을 위해 res.cookie를 사용하려면 Express의 Response 객체를 사용해야 한다. res를 import하고 res.cookie를 입력했는데 이렇게 인식하지 못하는 오류가 발생하였다.라면과구공탄2024.06.0510
- 💟 코딩테스트[프로그래머스] Lv.0 - 접두사/접미사인지 확인하기접두사인지 확인하기 문자열이 특정 문자열로 시작하는지 확인하는 문제였다. 처음에는 아무 생각없이 배열로 바꿔서 원소로 비교하려고 했었다. 그런데 이렇게 하면 순서에 상관없이 b안에 a의 원소가 들어있기만 해도 true 값이 나오기 때문에 오류가 난다. 문자열.startsWith(문자열) 문자열.startsWith(문자열, 비교를 시작할 인덱스) 이걸 사용하면 쉽게 풀 수 있다. 이러면 답이 나온다. 자바스크립트는 메서드만 알아도 쉽게 풀 수 있는 문제가 많다. 그런데 잘 안 외워져서 힘들다. 비슷한 문제로 접미사인지 확인하기 문제가 있다. 이것은 endsWith 메서드를 사용하면 된다. endsWith는 좀 특이한 점이, str.endsWith("to be", 19) 이런식으로 쓸 수 있는데, 이때 문자열 다음에 오는 숫자는 찾을 문자열의 범위를 말한다.라면과구공탄2024.05.3110
- JavaScriptforEach 내부에서 변수를 변경해도 원본 배열에 영향을 미치지 않음forEach를 사용해서 배열의 원소를 순회한다. forEach 내부에서 문자열 원소인 경우에는 숫자로 변경하여 원래 원소에 할당을 하도록 하였다. 그런데 출력해보면 기대와는 다른 값이 나온다. forEach 내부에서 변수 ele를 변경해도 원본 배열에는 영향을 미치지 않는다. ele는 배열 요소의 값을 참조하는 로컬 변수일 뿐이기 때문이다. 원본 배열을 변경하려면 인덱스를 사용하여 배열 요소를 직접 업데이트해야 한다. 예상한 대로의 값이 나왔다. 자바스크립트의 배열 함수를 사용할 때에는 이것을 주의해야한다.라면과구공탄2024.05.2810
자바스크립트 풀스택 개발자 최근 포스트
- 기타[C] 배열과 포인터 (1~2차원 배열) (24년 2회 정보처리기사 예제)포인터와 배열 포인터 C언어에서 포인터는 다른 변수의 메모리 주소를 저장하는 변수이다. • 선언 : int *ptr;은 정수의 주소를 저장하는 포인터 ptr을 선언하는 것이다. • 초기화 : ptr = &var;은 var 변수의 주소를 ptr 포인터에 할당한다. • 역참조 : *ptr은 ptr에 저장된 주소의 값에 액세스한다. 배열 C 언어에서 배열은 동일한 데이터 타입의 요소들을 연속된 메모리 위치에 저장하는 자료구조이다. • 선언 : int arr[5]; 는 5개의 정수를 담는 배열을 선언한다. • 초기화 : int arr[5] = {1, 2, 3, 4, 5}; 는 배열을 중괄호 안에 있는 특정 값들로 초기화한다. • 요소 접근 : 인덱스를 사용하여 배열 요소에 접근한다. 예: arr[0] 는 첫 번째 요소를 접근한다.라면과구공탄2024.07.3100
- Node.js/DB카카오 로그인 구현 시 발생한 에러 모음400 axios로 요청보낼 때 문법적 오류가 있어서 발생함. axios 공식문서에서 확인해보면서 비교해볼 것. 문법적 오류 혹은 뭐 하나 빠뜨려도 400이 뜸. 401 권한 오류 1) Redirect URL를 잘못 설정한 경우 Redirect URL : 로그인 성공시 프론트엔드에서 넘어가는 페이지 경로 프론트엔드와 백엔드에서 Redirect URI를 맞춰서 써줘야 함. 리액트의 경우 리액트 라우터의 경로가 되겠음. 개발시 주소, 배포시 주소를 모두 신경써야 함. 2) 카카오개발자 센터에서 사용주소, Redirect URI를 잘못 등록한 경우 localhost:1234에서 개발하는 경우 이 주소를 센터에 등록해줘야함. 아예 등록이 안 되어 있어도 문제이고, 주소를 잘못 입력한 경우도 문제가 됨. KOE320라면과구공탄2024.07.1101
- JavaScriptES6 Modules과 CommonJS Modules 차이점과 eslint 오류함수를 별도의 파일 안 클래스로 만들어, 코드 유지 관리하기 좋은 상태로 리팩토링하고 있다. Parsing error: ‘import’ and ‘export’ may appear only with ‘sourceType: module’ 라는 Eslint 오류가 났다. 현재 Node.js 환경에서 CommonJS Modules 을 지원하고 있지만 내가 쓴 export default FormValidator 라는 문법은 ES6 Module 문법이기 때문에 이러한 Eslint 오류가 발생한 것이다. ES6 Module • export 문법 : export default MulterConfig; • import 문법 : import CommonJS Module • export 문법 : module.exports = MulterConfig; • import 문법 : require라면과구공탄2024.07.0300
- Node.js/DBORM 라이브러리, prisma 포맷팅, 모델정의ORM 라이브러리 Express, NestJS : 서버 프레임워크 MySQL, PostgreSQL : 데이터베이스 TypeORM, Prisma, Mongoose : ORM 라이브러리 ORM 라이브러리(Object-Relational Mapping) - SQL 대신 자바스크립트 메소드를 사용해서 DB와 소통할 수 있음. - 데이터를 일반 객체처럼 다룰 수 있음. - ORM 라이브러리가 자바스크립트 메소드를 SQL문으로 바꿔서 실행해주는 것임. ORM 라이브러리 • RDB - TypeORM, Prisma, Sequelize • NoSQL - Mongoose Prisma 포맷팅 하는 방법 VSCode Prisma Extension 설치 후 Alt + Shift + F 누르면 prettier로 포맷팅이 가능함.라면과구공탄2024.06.2200