몽땅뚝딱 개발자

보호되어 있는 글입니다.

새로운 프로젝트에서 Next.js를 사용하게 되어 관리하는 프로젝트들이 14~18 버전으로 늘어났다. 특히 14버전까지만 대응이 가능한 프로젝트도 있어서 드디어 찾아보았다. 1. 버전은 nvm을 사용하여 관리한다. $ brew install nvm // brew를 사용하여 nvm 설치한다. $ nvm list // 현재 설치되어있는 nvm 버전들과 각 버전들을 알 수 있다. $ nvm use v00.00.0 // 해당 버전을 사용한다. 그런데 프로젝트 내에서 아무리 버전을 낮춰도 올려도 상위의 노드 버전은 변경 없이 그대로였다. 찾아보니 프로젝트 별로 세팅이 필요했다. 2. 로컬환경에서 프로젝트 별로 관리하고 싶은 경우 프로젝트 최상단에 .nvmrc 파일을 추가하고 사용하고 싶은 버전을 적는다. v18...

회사에서는 3가지의 홈페이지 빌더를 사용하고 있는데 GNB 영역에서 뭐 하나 수정하려고 하면 3가지 빌더를 다 수정해야 하는 점이 너무나도 비효율적이라(각 빌더 별로 담당자도 달라서 일하기도 불편..) 언젠가는 방식을 바꿔야지 생각만 하고 있었다. GNB 영역을 html, css, script가 다 포함된 공통 html로 하나 빼서 cdn 방식으로 불러와 사용하면 편할 것이라 머릿속으로 구상만 했다. 그런데 이번에 빌더에서 관리하는 페이지가 1개가 더 늘어나게 되면서 똑같은 코드를 또 사용하게 될 위기에 처했고 머릿속의 그 계획을 실행해야만 했다. 코드 한 줄 쓰면 끝나는 아주 효율적인 방식! 이었으나 3가지 문제에 봉착하고 만다. [미해결] 문제 1. html을 cdn으로 어떻게 불러올건데? 하나의 h..

Allow CORS: Access-Control-Allow-Origin Easily add (Access-Control-Allow-Origin: *) rule to the response header. chrome.google.com 로컬에서만 임시로 cors를 해결해야했었는데 동료분이 알려주셨다 😃 편하게 개발 완료 ,,, 👍🏻

📄 예제 코드 expect를 사용해본다. import {expect} from "chai"; import {substringsBetween} from "../script/chapter2"; describe('chapter2', () => { it('T1: null', () => { expect(substringsBetween(null, 'a', 'b')) .to.equal(null) }) assert 단언문을 사용해본다. import {indexOf} from "../script/chapter5"; const assert = require('assert') describe('chapter5. 속성 기반 테스트 - 예제 3', () => { it('T1: array가 널인 경우', () => { asser..

1. 아래 플러그인을 설치한다. 2. UI에서 확인할 수 있고 검색도 할 수 있다. 자주 쓸 것만 정리해보면 아래와 같다. 아이콘 코드 설명 원문 🎨 :art: 코드의 구조/형태 개선 Improve structure / format of the code. ⚡️ :zap: 성능 개선 Improve performance. 🔥 :fire: 코드/파일 삭제 Remove code or files. 🐛 :bug: 버그 삭제 Fix a bug. ✨ :sparkles: 새 기능 Introduce new features. 📝 :memo: 문서 추가/수정 Add or update documentation. 💄 :lipstick: UI/스타일 파일 추가/수정 Add or update the UI and style files..

회사에서 스터디를 하게되었다. 테스트는 백엔드에서 더 많이 사용하고 편리함도 높다고 알고있지만 프론트엔드에서도 분명 큰 역할을 하리라 생각한다. 공부기록은 여기...✏️ 🔖 이펙티브 소프트웨어 테스팅 ∕ 읽는 중 be-a-weapon.tistory.com ◽️ 모카란? 테스트 프레임워크다. 노드JS에서 많이 사용된다. assertion을 지원하지 않는다. 그래서 노드JS에서 제공하는 assert 모듈을 사용하거나 다른 Assertion 라이브러리(예를 들어 chai)를 설치해서 사용한다. ◽️ 설치하기 노트JS에서 제공하는 assert 모듈을 사용할 수도 있지만 chai는 체이닝 할 수 있는게 장점이라고해서 결정했다. $ npm i --save-dev mocha $ npm i chai @types/cha..

console.log("result >>> ", foo()) 이렇게 매번 결과에 대한 콘솔찍기가 귀찮아서 만들어 본 단축어. 1. ⌘ + , 를 사용하여 Preferences로 이동한다. 2. Editor > General > Postfix Completion에서 +를 누른다. 나는 JavaScript + TypeScript로 설정한 뒤 key를 'write'로 지정하고 아래처럼 추가해주었다. $EXPR$ : 이 곳에 표현할 함수나 변수명이 작성된다. $END$ : 마지막으로 커서가 갈 위치이다. 3. 아래와 같이 사용한다. 출처 JavaScript postfix templates | WebStorm www.jetbrains.com

혼자 build가 되질 않나.. 스타일 순서에 맞춰 정렬되도록 설정했는데 작동이 안되질 않나.. 잘되던게 안되서 작은 스트레스들을 받았지만 미세한 스트레스라 미루고있었는데 이번에 리액트 공부하며 같이 해결했다. 이제 의도대로 잘 동작한다. ◽ Options Reformat code: 코드 서식 재지정 Optimize imports: import문 최적화 Rearrange code: 코드 재정렬 Run code claenup: 코드 정리 실행 Run eslint --fix: eslint --fix 명령어 실행 Run Prettier: 프리티어 실행 Upload to default server: 디폴트 서버에 업로드 Build project: 프로젝트 빌드 (실행/디버그 중에는 트리거되지 않음) 참고 Int..

1. brew로 MySQL 설치 $ brew install mysql 2. 설정하기 // 서버 시작 $ mysql.server start // 여기서 초기화 $ mysql_secure_installation // 서버 종료 $ mysql.server stop 3. 워크벤치 설치 mac이 몬터레이인 상태에서 가장 최신 버전의 워크벤치를 설치했다. 사람들이 추천하는 버전은 8.22 버전이긴 했다. 아래처럼 설정하고 Test Connection 해보면 성공.