1. 오늘배운것

ㄱ.파이어베이스

• 파이어 베이스란 간단하게 백엔드개발을 할수 있는 페이지이다.
• 마침 로그인이랑 회원가입를 구현해보고싶어서 잘됐다 싶었다!!
• 유튜브를 통해 파이어베이스로 로그인로직과 회원가입 로직을 배워봤다.
• 로그인이랑 회원가입말고도 여러가지 기능이 있는데 이것들도 배워볼예정

ㄴ. 로그인로직

• 전부 복사붙여넣기 하는것이 아니라 id값을주고 그것들을 작성해야해서 이해하기가쉽다!! 수정도 쉬운편

• document.getElementById('signinbutton').addEventListener('click', (event) => {
        event.preventDefault()
        const signinemail = document.getElementById('signinemail').value
        const signinpassword = document.getElementById('signinpassword').value
        signInWithEmailAndPassword(auth, signinemail, signinpassword)
          .then((userCredential) => {
            // Signed in 
            alert('로그인성공');
            var link = 'https://www.naver.com/';
            location.href = link;
            location.replace(link);
            window.open(link);
            const user = userCredential.user;
            // ...
          })
          .catch((error) => {
            alert('로그인실패')
            const errorCode = error.code;
            const errorMessage = error.message;
          });
          ``` 

ㄷ. 회원가입로직

• 회원가입역시 로그인로직과 다르지않았다. id값만 다르게 했을뿐

• const app = initializeApp(firebaseConfig);
      const analytics = getAnalytics(app);
      import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword } from "https://www.gstatic.com/firebasejs/9.14.0/firebase-auth.js";
      const auth = getAuth();
      document.getElementById('singUpbutton').addEventListener('click', (event) => {
        event.preventDefault()
        const signUpemail = document.getElementById('signUpemail').value
        const signUppassword = document.getElementById('signUppassword').value
        createUserWithEmailAndPassword(auth, signUpemail, signUppassword)
          .then((userCredential) => {
            alert('회원가입성공')
            location.href = './test.html'
            // Signed in 
            const user = userCredential.user;
            // ...
          })
          .catch((error) => {
            alert('회원가입실패')
            const errorCode = error.code;
            const errorMessage = error.message;
            // ..
          });```

ㄹ. location.href / var link

• 로그인페이지와 회원가입 페이지의 html을 각각 나눠놨다.
• 그 이유는 각각 따로 보였음 좋겠어서였는데 생각해보니 그둘을 연결하는걸 자바스크립트에선 할줄 몰랐다.
• 하지만 둘다 연결할 필욘없고 회원가입하고 로그인페이지로 넘어가게끔만 하는것이었는데.
• 찾다찾다가 드디어 찾았다 바로 locatio,href ='./파일명' 이라고 적으면된다
• 같은폴더라면 ./ 상위폴더라면 ../라고 한다!!
• 로그인페이지에서 로그인을 완료하면 메인페이지로 이동하게끔할건데 아직 메인페이지 구성을 안해봐서 일단 네이버에 걸어봤다.
• var link = 'https://www.naver.com/'; 이렇게 하면 걸리더라!!

ㅁ. input = type "password"

• 회원가입을할때 비밀번호에 숫자를 넣으면 가입이 안되는 오류있었다.
• 근데 그게아니라 최소 숫자 6자 이하를 넣어서 안되는거였다...
• input type password는 최소 6자 최대 12자 이상이라고 한다.. 처음알았다.

2. 아쉬운점

• 오늘은 아쉬운점이 없다.
• 처음부터 끝까지 힘들었지만 결국 해결해냈고 오늘 목표를 다하였다!!

회고

• 오늘 처음으로 코딩이 재밌었다 모르는걸 찾아보고 그걸 해결했을때 엄청 짜릿했음.
• 매일이 오늘같으면 아주 좋을듯..
• 쓰다보니 진짜 일기장에 일기 쓰는거같네ㅋ