Today Hailie Learned

필요한 키를 받아서 폴더의 최상단에 .env 파일을 만들고 키를 입력한다. 했는데도 아래와 같은 오류가 나왔다. CompileDaemon -command="./main .env" \ -build="wire && swag init && go build -o ./main ./" \ -exclude-dir=docs \ -exclude=wire_gen.go \ -directory . /bin/sh: CompileDaemon: command not found make: *** [watch] Error 127 path를 설정해야한다고 함... cli 환경에서 vim ~/.zshrc 제일 하단에 필요한 path를 설정한다. 여기서는 go path export GOPATH="$HOME/go" export PATH="$..

◆ docusaurus에서 최신 블로그 글 가져오는 방법 (사진이나 글쓴이 없이 제목과 링크만 가져오는 방법) import React from 'react' import recentPosts from '../../../../.docusaurus/docusaurus-plugin-content-blog/default/blog-post-list-prop-default.json' const BlogItem = () => { // console.log(recentPosts) return ( {recentPosts.items.slice(0, 5).map((item, index) => ( {item.title} ))} ) } export default BlogItem 참고) https://stackoverflow.c..

사이즈 용량 줄이기가 아니라 svg 크기 줄이기 방법입니다. 기존 svg 코드 preserveAspectRatio="none" 을 넣고 width와 height를 수정하면 됩니다. svg 관련 추천 사이트 코드 입력시 svg 를 볼 수 있습니다. https://www.svgviewer.dev/

1. git log로 히스토리를 확인합니다. git log ♣tip 확인하고 나올때는 :wq를 입력 2. 고치고 싶은 커밋이 위(HEAD)에서부터 어디에 위치한지 확인합니다. git rebase -i HEAD~3 → 위에서 3번째 커밋을 수정하고 싶다! 3. 수정하고 싶은 커밋의 pick을 reword로 수정합니다. ♣tip 수정은 i로 시작하고 수정완료시 esc를 누르고 :wq를 입력 4. reword를 입력했던 부분의 커밋 내용이 나오는데 여기서 수정할 수 있습니다. ♣tip 수정은 i로 시작하고 수정완료시 esc를 누르고 :wq를 입력 위의 내용은 push 하기 전 상태의 commit message 수정할 수 있는 방법입니다. ♣tip 마지막 Commit 메시지 수정하는 방법은 아래 명령어로 간단하..

✔️ 환경 변수 파일이란? 애플리케이션이 실행될 때 특정 값을 넘길 수 있는 변수를 의미합니다. .env 파일에 정의된 변수를 의미하고, 미리 정의된 값을 애플리케이션에서 활용하고 싶을 때 사용합니다. ✔️ 환경 변수 파일을 왜 사용할까? 👉보안과 유지보수에 용이하기 때문에! port, db 관련 정보, API_KEY 등 오픈소스에 올리면 안되는 값을 dotenv 패키지(환경변수 파일)를 사용해서 소스코드 내에 하드코딩하지 않고 사용할 수 있다는 장점이 있습니다. ✔️ 사용 방법 ▶ .env 내에서 환경변수 적는 방법 REACT_APP_FIREBASE_API_KEY = "" REACT_APP_FIREBASE_AUTH_DOMAIN = "" ▶ 환경변수 가져와서 사용하는 방법 apiKey: process.e..

git branch -r 👉 clone 받은 레파지토리의 전체 브랜치 확인하기 git switch origin/[브랜치명] 👉 원하는 브랜치로 이동하기 (checkout이 switch로 바뀜) git switch -c [새로운 브랜치명] 👉 새로운 브랜치 만들고 바로 거기로 이동하기 git branch -d [브랜치명] 👉 원하는 브랜치 삭제하기 (원 브랜치과 비교해서 변경사항이 없을때만 가능하다. ) 삭제하려는 브랜치에서 사용 불가! 다른 브랜치에서 삭제가능 git branch -D [브랜치명] 👉브랜치를 강제로 지우기 삭제하려는 브랜치에서 사용 불가! 다른 브랜치에서 삭제가능 git branch -m [브랜치명] 👉브랜치 이름 변경 이름 변경하려는 브랜치에서 사용!! git mv [기존폴더명] [임시..

✔️ 3주차 과제에서 피드백 받은 내용과 배운 내용 ■ 처음 랜더링이 되고나서 해당되는 데이터가 어느 데이터인지 색으로 표시해야한다. 해결방법 => 서버에 보내주는 데이터가 index 0부터 시작하니까 서버에 요청하는 데이터 역시 index 0부터 시작해야한다. ■ 서버에서 받은 데이터 중에 [object Object]로 나타는 문제가 있었는데 그 문제가 초기 상태를 빈 객체로 설정해서 나온 문제였다. (실제로는 '문자열'임) 만약 서버에서 받은 데이터가 실제로 객체 형태라면 JSON.stringfy로 묶어주면 된다. ■ input 태그에서 value와 defaultValue의 차이 역할은 같다. value는 값이 변하지 않을 때 사용. value를 사용한다면 readOnly 속성을 true로 설정하면 ..

✔️ 2주차 과제에서 피드백 받은 내용 차트를 chart.js 파일로 컴포넌트로 따로 관리한 점이 좋음. html/css로 구성된 파일을 리액트로 구현할 때 class를 className으로 꼭 바꾸기!! 기존의 a 태그에 있던 html 경로를 기본 경로인 /로 바꾸기. ✔️ 3주차 실무 PT 주제 동적 화면 구현을 위한 React의 state/props + useState와 useEffect ✔️ 이번 주 수업을 통해서 배운 점 ■ State와 Props state - 컴포넌트 안에서 관리 되고, 바뀌는 동적인 데이터 (= 변수) 변하는 값은 상태에, 변하지 않는 값은 그냥 변수로 선언해서 사용하는 것이 좋다! Props - 컴포넌트 간에 전달되는 데이터 (부모->자식 단방향 흐름) 자식에서 부모 컴포..

✔️ 1주차 과제 refactoring 요구사항이 한 페이지로 구성된 애플리케이션이지만 혹시 모를 페이지 확장성을 염두하였고, components 폴더에 한번에 파일을 추가하는 것보다 자주 쓰이는 컴포넌트를 common 폴더에 넣고, 그 외 추가될 페이지마다 폴더를 생성해서 컴포넌트를 정리하면 더 깔끔한 폴더구조를 가질 수 있다고 생각해서 수정하였습니다. ✔️ 2주차 실무 PT 주제 React 스타일링 방법과 반응형 웹 적용 ✔️ 이번 주 수업을 통해서 배운 점 ✦ 요구사항 정의서 요구사항 정의서를 작성할 때는 데이터를 주고 받는 부분을 자세하게 적어주어야한다. 1. 클라이언트 단에서 어떤 버튼을 누르면 데이터를 받아올건지 추가해주기 2. 어떤 데이터가 어디에 쓰이는지 적어주기 ✦ CSS 모든 HTML ..