🎉 성과 완성한 부분 소셜 로그인시 소셜에서 사용하던 닉네임 불러오기, GitPage로 배포 ✨ 느낀점 👍 알게 된 점 배포 할 경우 색인 추가 배포하기 전에는 상관없었지만, 배포 후에는 내가 생성한 트윗을 불러오기 위해서는 색인이 필요하기때문에 색인을 추가했다. 색인을 추가하지 않을경우에는 내가 만든 웹사이트가 제대로 작동하지 않게된다. 색인추가 방법은 배포 후에 콘솔창을 띄우게되면 색인추가하라는 링크를 클릭하면 해당 홈페이지로 이동하게되는데, 그 때 색인을 추가하면된다. React를 사용한 웹사이트 Git-Page로 배포하기 1. 내가 만든 코드를 깃허브에 올린다. 2. 터미널에서 깃페이지로 올려주는 모듈을 설치한다. npm i gh-pages 3. package.json 파일 제일 밑에 homepa..

🎉 성과 완성한 부분 파일 업로드하여 데이터베이스에 추가 및 삭제, 트윗삭제시 파일도 연쇄적으로 삭제 ✨ 느낀점 👍 알게 된 점 Firebase를 이용하여 Storage에 파일 생성 완료 업로드한 파일 미리보기 const [File, setFile] = useState(''); const onFileChange = event = > { const {file} = event.target; const myfile = file[0]; const reader = new FileReader(); reader.readAsDataURL(myfile); reader.onloadend = (finished) => { const {result} = finished.current.Target; setFile(result) ..

🎉 성과 완성한 부분 소셜 로그인 기능 구현 완료 google, github, 회원가입 등 3가지 방법으로 로그인 구현 완료 useNavigate()를 활용하여 로그아웃 시 Home페이지로 리다이렉트 firebase 8 버전 이하는 Redirect를 사용했지만, 9 버전부터는 useNavigate()를 이용한다. ✨ 느낀 점 👍 알게 된 점 로그인 상태 유지하기 로그인을 하면 Home페이지로 가게 코드를 구현했는데 정상 작동하지 않았다. 그 이유는 firebase가 로딩되기 전에 코드가 실행되어서 이다. 따라서 firebase가 전부 로딩된 다음에 코드를 실행시켜주는 코드를 작성해야 한다. firebase에서 지원하는 onAuthStateChaged() 코드를 사용하면 된다. import {onAuthS..

All Courses – 노마드 코더 Nomad Coders 초급부터 고급까지! 니꼬쌤과 함께 풀스택으로 성장하세요! nomadcoders.co 👩‍💻 이 프로젝트로 정한 이유 React를 학습하면서 React에 대한 실력을 향상하고자 시작하게 되었다. 🎉 성과 완성한 부분 firebase의 Sign-in method 설정 완료 인증 웹페이지 골격 개발 input태그와 form태그, button태그로 기본 골격을 만들었고, copyright와 현재 년도는 밑의 코드로 작성하였다. © {new Date().getFullYear()} twitter ✨ 느낀점 👍 알게 된 점 코드 단축하기 -1- input 태그에 사용되는 value값을 단축코드로 완성했다. 단축코드를 사용하지 않으면 input의 사용 개수가..