문익점 스토리

안녕하세요. 문익점이에요. 문익점에 대해 아시나요? 목화씨를 가져온 문익점이요!

코딩

jsconfig.json 또는 타입스크립트를 사용하고 있다면 tsconfig.json을 만들고 아래에 추가한다. { "compilerOptions": { "baseUrl": "src" }, "includes": ["src"] }

코딩

깃 허브 레포에 푸쉬하거나 풀 할때 http보다 좀 더 안전한 방식이 ssh이라고 합니다. 이 키를 등록하는 방법입니다. SSH 키 만들기 (mac 기준) $ ssh-keygen -t ed25519 -C "your_email@example.com" 명령어를 입력하게 되면 SSH 키에 대한 비밀번호를 추가로 지정할지 물어봅니다. 패스워드를 설정해도 되지만 간단한 설정을 위해 엔터를 두 번 입력해줘어 패스합니다. 이제 ssh의 공개 키와 개인 키가 생성되었는지 확인 합니다. $ cd ~/.ssh $ ls 그럼 SSH 키가 생성되었습니다. id_ed25519는 개인 키, .pub이 붙은 파일은 공개 키 입니다. $ cat id_ed25519.pub cat 명령어를 이용 해 공개 키의 내용을 확인 한 뒤 모두 ..

코딩

CRA typescript로 프로젝트에 emotion를 적용 할 때 css prop로 스타일이 전달이 안될 때 해결법입니다. package.json 파일에서 아래의 3가지 의존 패키지 설치 되있는 지 확인 2. tsconfig.json에 아래 옵션 추가 짜잔

코딩

CI/CD 란? 프로젝트 개발 부터 배포 될 때까지의 모든 단계를 자동화를 통해 좀 더 효율적이고 빠르게 대응 할 수 있도록 만드는 것이다. 규모가 커진 프로젝트라면 일일히 개발자가 수동으로 배포하고 버전을 관리 한다면 굉장히 비용이 들지만 CI/CD를 구축하게 된다면 자동화를 통해 비용을 굉장히 절약할 수 있습니다. CI와 CD는 분리된 개념이아니라 묶어서 불립니다. 즉 이 두 개념은 서로 연관되어 있습니다. 아래는 두 가지에 대한 설명입니다. CI CI, 지속적 통합(Continuous Integration)은 새로 만든 기능이나 버그 픽스등 변경 내용이 깃 레포에 지속적으로 빌드되고 테스트되는 것을 말합니다. 주기적으로 머지된 코드들은 자동으로 빌드되고 테스트 되어서 머지 충돌이나 코드의 문제점을 ..

코딩

Git flow는 깃을 같이 쓰는 팀원들 간 branch를 어느 방식으로 사용해서 운영 할 지 약속하는 방법론입니다. 일종의 브렌치 전략이라고 불립니다. 개발을 진행하다보면 프론트, 서버 등 많은 개발자들과 개발 흐름을 맞춰야하기 때문에 개발 프로세스에 대한 합의가 필요합니다. 이러한 전략을 잘 새우고 따른다면 기능 개발과 배포, 버그픽스등 프로젝트를 관리하는데 있어 편리합니다. Git-flow는 총 5가지의 브랜치를 사용해서 운영을 합니다. master : 제품으로 출시될 수 있는 브랜치 develop : 다음 출시 버전을 개발하는 브랜치 feature : 기능을 개발하는 브랜치 release : 이번 출시 버전을 준비하는 브랜치 hotfix : 출시 버전에서 발생한 버그를 수정 하는 브랜치 출저 -h..

코딩

나는 처음 개발 공부를하고 개인 프로젝트를 만들면서 굳이 클린코드? 좋은코드?라는게 필요한가?라는 생각이 항상 있었다. 그 프로젝트는 팀원이 2명이였는데도 그닥 필요성을 느끼지 못했다. 하지만 지금 만 9개월동안 프론트엔드로 일하다가 느낀바로는 클린코드는 무조건 필요하다. 생각이 달라진 이유 그 때와 지금이 다른 점이 무엇일까 생각해보면 현업을 경험하고나서 내가 내린 클린코드의 정의가 달라졌다. 처음 개발을 배우면서 클린코드라는 단어를 들었을 때 내가 받아드린 정의는 그저 깨끗한 코드였다. 어떤 기능을 하는 메소드인지 한 눈에 보면 딱 알 수 있고 그러한 함수들로만 이루어진 코드 들. 그러한 코드들을 짜기 위해 마치 가내 수공업 하듯이 한땀 한땀 메소드을 만드는 것. 그저 사람이 보기 이쁜 코드를 짜는 ..

코딩

2021-05-09일에 작성 된 글입니다. 프로젝트 소개 CoronaVac 공공데이터 중 코로나 백신 접종 통계 api를 이용하여 사용자가 통계 자료를 쉽게 볼 수 있는 서비스를 제공하는 웹 사이트 https://www.coronavac.site/ https://github.com/choejoonkyung/CoronaVac-client 진행 기간 2021년 4월 29일 ~ 2021년 5월 9일 기술 스택 React TypeScript React-Router React-Query Recoil Emotion Echarts 대표 사진 회고 프로젝트를 진행 하게 된 계기 여느때와 다름없이 회사에서 일 하던 도중에 회사 동료에 의해서 velopert님이 유튜브에서 라이브 코딩 방송을 한다는 것을 알게되었다. 리액..

코딩

oop의 구성요소 중에 상속이 있습니다. 상속은 클래스를 정의 할 때 부모 클래스의 정의 된 필드와 메소드들을 말 그대로 이어 받아 정의 할 수 있는 것 입니다. 하지만 이 상속은 오히려 변경의 유연함을 해치므로써 코드의 유지보수에 문제를 야기하게 됩니다. 코드의 유지보수에 문제가 생기는 것은 치명적인 단점입니다. 그래서 상속 보단 조립을 사용해라! 라는 말이 있습니다. 아래는 그에 대한 설명입니다. 상속의 사용 상속을 통하여 하위 클래스를 정의하는 것은 상위 클래스의 기능을 오버라이딩(재정의)하거나 재사용하는 방식으로 사용됩니다. 간단한 예시 입니다. BankAccount는 Asset에서 확장되고 있고 SavingAccount는 BankAccount에서 확장되며 정의 되고 있습니다. 즉 상속은 하위 클..