본문 바로가기
반응형

전체 글70

내가 걸어온 길과 나아갈 길 개발 이야기들은 인스타 easy_develop에도 올라옵니다! (이번 글은 2022.01.19일에 작성) 연말이라 다른 개발자가 쓴 1년 회고 기록을 읽었는데 내가 개발했던 것들도 기록하면 좋을 거 같아 지금까지 했던 것들을 써보려 한다. 2020년 2학년 2학기 개발이라는 것을 시작한 시기이다. 이전까지는 C언어 조금, 한과영에 들어온 후 시작한 python 정도만 알고 있었다. 개발의 시작은 HTML, CSS였던 것 같다. 솔직히 이때를 되돌아보아도 왜 갑자기 웹 개발을 시작한 것인지는 모르겠다. 중학교 때 C언어를 시작했던 것과 같이 “그냥”이라는 대답밖에 하지는 못할 것이다. 당시 명확한 목표는 없었기에 실력이 크게 오르지는 않았다. 그러나 웹 개발이라는 분야를 알게 되고 HTML, CSS, PH.. 2022. 6. 11.
[NextJS] react-quill ReferenceError: document is not defined 에러 해결 [ 문제점 ] Next js프로젝트에서 react-quill을 설치하고 일반적인 컴포넌트 가져오는 식으로 import ReactQuill from react-quill 이처럼 코드를 작성하면 document is not defiend이라는 오류가 나오면서 정상적으로 작동되지 않는다. [ 해결 방법 ] Next JS는 SSR(Server Side Rendering) 먼저 이러한 문제가 생긴 이유는 Next js는 SSR(server side rendering)을 하기 때문이다. SSR이란 화면에서 보여줄 페이지를 서버에서 먼저 렌더링을 한 후에 클라이언트에게 제공한다. CSR(client side rendering)을 화면을 조작한는 자바스크립트 파일을 모두 로드해야 해서 속도가 느리지만 SSR의 경우에는.. 2022. 6. 10.
[Heroku] Running bash - Error: connect ETIMEDOUT 해결 [ 문제점 ] 명령 프롬프트에서 heroku bash를 사용하기 위해서 heroku run bash -a [appName]명령어를 사용하였다. 그러나 다음과 같은 오류가 나오면서 정상적으로 작동되지 않았다. C> heroku run bash -a [appName] Running bash on ⬢ motte-app-backend... done Error: connect ETIMEDOUT 44.194.95.226:5000 [ 해결 방법 ] 아직까지 이러한 원인이 나타나는 명확한 이유는 알지 못한다. 인터넷 원활한 곳에서 같은 명령어를 하면 또 되는 경우도 있고. 그러나 다른 방법으로 어떻게 해결했는지를 소개하려 한다. heroku 웹사이트에 들어가서 bash를 열려고 하는 앱에 들어간다. 그러면 오른쪽 상단.. 2022. 6. 10.
[NestJS] typeOrm migration 정리 typeorm 에서 database migration을 하기 위해서는 ormconfig에 마이그레이션 파일이 들어갈 위치를 지정해 주어야 합니다. root directory에 ormconfig.json파일에 써도 무방하지만 저는 develop 환경과 production 환경을 분리하기 위해서 ormconfig.ts파일을 만들고 환경변수 NODE_ENV에 따라서 두 환경을 분리하였습니다. import { ConnectionOptions } from 'typeorm'; const typeormConfig: ConnectionOptions = process.env.NODE_ENV ? { url: process.env.DATABASE_URL, type: 'postgres', synchronize: false, .. 2022. 6. 10.
[CSS] Font property font-family does not have generic default 해결 [문제점] 커스텀 폰트를 사용하고 텍스트에 font-family로 설정을 해주었더니 webstorm에서 아래와 같은 경고가 나왔다. @font-face { font-family: "galmuri"; src: url('/fonts/Galmuri11.ttf'); } .text { font-family: galmuri; } Font property font-family does not have generic default [해결 방법] 우선 webstorm에서 나온 경고이기 때문에 커스텀 폰트만 제대로 적용을 했다면 웹은 정상적으로 보일 것이다. 정상작동을 하는데도 경고를 한 이유는 네트워크 오류 등 커스텀 폰트를 불러오지 못했을 때를 대비하라는 의미이다. 따라서 그 대용 폰트를 지정해주면 경고는 사라진다. .. 2022. 2. 23.
[Heroku] Heroku Cli command 모음 (app bash, login 등) Heroku Cli 설치가 완료된 상태를 기준으로 합니다. 커맨드는 계속해서 추가 할 예정입니다. 1. heroku VERSION heroku/7.59.0 win32-x64 node-v14.17.2 USAGE $ heroku [COMMAND] COMMANDS access manage user access to apps addons tools and services for developing, extending, and operating your app apps manage apps on Heroku auth check 2fa status authorizations OAuth authorizations autocomplete display autocomplete installation instruction.. 2022. 2. 12.
[NestJS] Heroku, no pg_hba.conf entry for host, SSL off 해결하기 [문제점] TypeOrm과 Postgres를 사용해서 Nestjs db를 세팅하고 heroku에 배포하는 과정에서 문제가 발생했다. typeorm설정을 하고 배포를 하였더니 서버오류가 나서 heroku log를 살펴보았더니 다음과 같은 에러가 나왔다. ERROR [ExceptionHandler] no pg_hba.conf entry for host "", user "", database "", SSL off [해결 방법] postgres의 pg_hba.conf 파일에서 문제가 생긴 줄 알았으나 구글검색을 해보니 다른 원인을 알 수 있었다. typeorm에서 SSL설정을 해주면 문제는 해결된다. ormconfig.json에서 수정을 하거나 typeorm.forRoot 내부에서 바로 수정을 하면된다. 위의 .. 2022. 2. 12.
[WebStorm] ESLint: Insert `⏎` (prettier/prettier) error 해결 [문제점] WebStorm을 사용해서 nestjs 프로젝트를 하는데 ide에 빨간줄이 표시되면서 아래와 같은 경고창이 나왔다. ESLint: Insert `⏎` (prettier/prettier) [해결 방법] 오류가 나온 원인은 ESLint의 규칙을 따르지 않아서 경고 형식으로 나왔던 것이다. ESLint에서 여러 규칙이 있겠지만 나의 경우에는 파일 마지막에 줄넘김을 하지 않아서 생긴 것이었다. 예를 들어서 Class를 선언하고 중괄호를 line 13에서 닫았다고 하자. 그러면 파일이 13 line까지만 있으면 ESLint가 경고를 하지만 14 line에 빈 줄을 만들면 해결된다. 이렇게 수동으로 할 수도 있지만 WebStorm에서 설정을 하면 저장시 자동으로 맞추어 준다. File -> Setting.. 2022. 2. 10.
[Flutter] AVOID using forEach with a function literal 해결하기 [문제점] 플러터 프로젝트를 하는중에 forEach를 쓰니 오류는 아니지만 아래 노란줄이 나오면서 다음과 같은 문구가 나왔다. AVOID using forEach with a function literal. [해결 방법] dart에서 forEach 문법을 권장하지 않기에 생기는 문구이다. 해결방법은 forEach가 아닌 for문을 사용하면된다. 안좋은 예시 for (element in map.keys) { ... } 좋은 예시 for (element in map.keys) { ... } [참고한 자료] Flutter : Avoid using `forEach` with a function literal Hi everyone this is my whole method : Future init() async .. 2022. 2. 7.
반응형