vscode에서 ctrl + , 를 눌러서 해당부분 클릭 { "java.home": "C:\\Program Files\\Java\\jdk-17", "java.configuration.runtimes": [ { "name": "JavaSE-1.8", "path": "C:\\Program Files\\Java\\jdk1.8.0_251", // 기존 1.8 JDK SE }, { "name": "JavaSE-17", "path": "C:\\Program Files\\Java\\jdk-17", // Open JDK 17 SE "default": true } ], "java.configuration.updateBuildConfiguration": "interactive", "files.exclude": { "**/..

TypeScirpt는 JavaScript의 Superset이다 브라우저와 같은 자바스크립트 환경에서는 실행되지 않는다.(브라우저가 타입스크립트를 실행시키지 못함) 타입스크립트는 프로그래밍 언어이며 도구이다 코드를 작성해서 실행하면 자바스크립트 코드로 변환 바닐라 JS 로는 조건을 추가적으로 달아주지 않으면 입력받은 숫자값을 문자열로 받아들인다 ex) 10+5 = '105' (sudo) npm install -g typescript 리눅스 환경에서는 sudo를 넣어야 올바른권한이 생긴다. 해당설치를 하면 PC전역게 타입스크립트가 설치된다. tsc명령어를 실행하면 컴파일러 타입을 호출하여 타입스크립트 파일을 자바스크립트 파일로 컴파일한다. 같은구조를 가진 js파일이 있으면 ts파일에서는 오류가난다 타입스크립..

Security Rules user가 프로젝트의 firebase DB에서 데이터를 읽어올 수 있게 허용하기 위해선 해당 위치에서 코드를 작성 service cloud.firestore { match /databases/{database}/documents { match /tweets/{doc} { allow read, create: if request.auth != null; } } } tweets Collection에 있는 아무 document나 읽을 수 있게한다. 누구든 권한이 있다면 DB에서 데이터를 읽고 글을 작성할 수 있다. allow delete, update: if request.auth.uid == resource.data.userId; 해당 코드를 추가하여 삭제 수정 요청을 보낸 유저의 ..

Firebase Hosting 호스팅 페이지에서 시작하기를 누르면 해당 화면이 출력된다 Firebase CLI를 설치해준다 npm install -g firebase-tools Google에 로그인 하기위해서 firebase login 입력을하면 해당 문구가 나오는데 정보수집여부 동의 Y/N 을 선택해주면 구글 로그인창이 뜬다 성공하면 해당 문구가 뜨면서 연결된 이메일을 출력해준다 firebase init 을 입력해준다 (initiate : 초기화) "Are you ready to proceed? (Y/n)" 라는 질문이 나오는데, 이것은 Firebase 프로젝트 초기화를 진행할 준비가 되었는지를 묻는 것 yes를 누르면 해당 화면이 출력되는데 프로젝트를 어떤요소로 구성하고싶은지 묻는 창이다 여기서 Ho..

개발환경이 변경되어서 설치되어있던 firebase버전에서 충돌이나서 발생한 현상, npm uninstall -g firebase-tools 를 통해서 firebase를 삭제하고 npm install firebase 재설치를 진행해준다

const user = auth.currentUser; {user?.displayName ? user.displayName : "Anonymous"} user의 이름이 있을경우에는 출력해주고 없을경우엔 Anonymous 를 출력해준다 해당 if문은 user.displayName이 중복으로 쓰이는데 {user?.displayName ?? "Anonymous"} 이런식으로 표현이 가능하다. const [avatar, setAvatar] = useState(user?.photoURL); useState로 사용자 이미지의 URL을 가져온다. {Boolean(avatar) ? : } Boolean을 사용해서 유저가 등록한 이미지가 있는지 확인하기 이미지가 없을 시 기본값이 되는 svg 이미지를 출력하고 이미지가 ..