본문 바로가기

분류 전체보기369

[Nextjs] 설치

npx create-next-app nextjs-blog --use-npm --example .., yarn create next-app blog --example "https://github.com/vercel/next-learn/tree/master/basics/learn-starter" next/Link와a 의 차이점 next/Link는 Client Side Navigate로 동작함. *Client Side Navigate는 browser에서 url을 직접 쳐서 이동하는 것과 달리, js상에서 page 컴포넌트를 교체함. a태그는 페이지 자체를 다시 리로드함. 페이지가 새로고침됨. 그니까, next/link는 링크로 이동할 페이지에 대해서, prefetch를 하거나, client-side-rende.. 2022. 9. 21.

[Javascript] 모르는 부분

reduce javascript에서 가장 강력크한 기능?이다? reduce 함수는 네 개의 인자를 가진다. 1. 누산기(acc) 2. 현재 값(cur) 3. 현재 인덱스(idx) 4. 원본 배열(src) 리듀서 함수의 반환 값은 누산기에 할당되고, 누산기는 순회 중 유지되므로, 결국 최종 결과는 하나의 값이 된다. 배열에 각 요소에 대해 함수를 실행하고 누적된 값을 출력할 때 용이하다. const arr = [1,2,3,4,5]; const result = arr.reduce((acc, cur, idx) => {return acc +=cur}, 0); console.log(result); // 15 const arr2 = [1,2,3,4,5] const result2 = arr2.reduce((acc, .. 2022. 9. 20.

[Nextjs] 기본 절대 경로 설정하기

홈 디렉토리 경로에 jsconfig.json 폴더에 다음을 작성 { "compilerOptions": { "baseUrl": "src" } } 2022. 9. 20.

[jest] svg를 import한 vue 컴포넌트 테스트 실행 오류 해결방법

jest 테스트 실행 할 때, 오류 내용 SyntaxError: Unexpected token ' 2022. 9. 19.

[AWS + mongodb] 설치 및 실행

설치 문제 sudo service mongod start 안 됨. 해결 방법 /tmp 경로에 sock 파일을 삭제 후, sudo service mongod start rm -rf mongo-... sock 파일 삭제 2022. 9. 17.

프로젝트에 node-sass 없애고, dart-sass로만 운영하기

sass-loader에서 scss로 작성된 코드들을 인식해서 node-sass로 던져서 css로 코드를 변경하고 있었습니다. implementation은 이제 node-sass가 아닌 dart-sass (sass)를 이용하라고 선언하는거고요 2022. 9. 16.

[vue-test-utils] select html tag 테스트 방법

select 태그를 단위테스트할 경우, 참고: https://v1.test-utils.vuejs.org/api/wrapper/setselected.html setSelected | Vue Test Utils setSelected Selects an option element and updates v-model bound data. When you try to set the value to state via v-model by option.element.selected = true; parentSelect.trigger('input'), v-model is not triggered. v-model is triggered by change event. optio v1.test-utils.vuejs.org s.. 2022. 9. 16.

[AWS] s3 + cloudfront 웹 띄운 거, 원하는 도메인 설정

클라우드프론트 도메인을 Route53에서 도메인을 할당하면 된다. 2022. 9. 15.

[css] image 이미지 사진 비율 변형 안 하고 보이기

before img { width: 100%; height: 130px; } after img { width: 264px; } 2022. 9. 10.

[vscode] rest client plugin

1. 패키지 설치 2. .rest 또는 .http 파일 생성 후, 다음 형식으로 작성 GET https://apis-v2-staging.naver.com/api/v2/user HTTP/1.1 content-type: application/json Authorization: Bearer ### request header 작성법 GET https://apis-v2-staging.naver.com/api/v2/user HTTP/1.1 content-type: application/json 👈 Authorization: Bearer ~ 👈 request body 작성법 GET https://apis-v2-staging.naver.com/api/v2/user HTTP/1.1 content-type: applica.. 2022. 9. 9.