홍가의 코딩공부

고정 헤더 영역

글 제목

메뉴 레이어

홍가의 코딩공부

메뉴 리스트

  • 홈
  • 분류 전체보기 (54)
    • Html, Css, JavaScript 기초공부 (27)
    • 깃허브 사용법 (10)
    • React 공부 (4)
    • Project (React) (7)
    • Project (Next) (2)
    • 면접 공부 (2)
    • DB 공부 (0)

검색 레이어

홍가의 코딩공부

검색 영역

컨텐츠 검색

firebase사용법

  • firebase DB내용 삭제 및 수정하기

    2023.09.22 by hongga

  • firebase DB생성 및 내용 보여주기

    2023.09.18 by hongga

  • firebase으로 로그인 방식 설정하기

    2023.09.02 by hongga

  • firebase React와 연동하여 사용해보기

    2023.09.01 by hongga

firebase DB내용 삭제 및 수정하기

안녕하세요 홍 가 입니다. 오늘은 마지막 부분인 DB내용을 삭제 및 수정하기가 되겠습니다. 사진과 같이 원래는 삭제 수정 버튼이 위에 "새로운 컴포넌트..." 부분에도 있어야 하지만 보이지 않습니다. 보이지 않는 이유는 제가 임의로 사용자 아이디를 바꿔서 보이지 않습니다. firebase에서 제공해주는 database부분에 접근하여 글 삭제를 하도록 했습니다. onChange에서는 e.target.value를 사용하고 onSubmit에서는 e.preventDefault();를 사용한다. firebase에서 제공해주는 database부분에 접근하여 업데이트를 하도록 했습니다.

Project (React) 2023. 9. 22. 10:00

firebase DB생성 및 내용 보여주기

안녕하세요 홍가 입니다. 오늘은 firebase DataBase를 생성해보려고 합니다. firebase에서 제공해주는 DB를 사용해보려고 합니다. 이렇게 직접 작성을 해도 됩니다. 저는 연동을 시켜서 사용하려고 해요 firebase파일에 가서 작성을 해줍니다. submit으로 보내주는데 collection과 document로 구성이 되어 사용되는데 collection부분에 texts라는 파일을 생성해주고 그 내부 document에 내용과 날짜를 넣어주고 setText로 text값을 받아 적용이 됩니다. 텍스트를 치고 등록을 누르고 firebaseDB로 오시면 이렇게 생성이 된걸 보실수 있습니다. 홈 화면에 보여주기 위해 코드작성 이렇게 화면에 나타나게 됩니다.

Project (React) 2023. 9. 18. 10:00

firebase으로 로그인 방식 설정하기

안녕하세요 홍 가 입니다. 오늘은 firebase로 로그인 구현을 해보려고 합니다. firebase는 Auth서비스를 제공해주는데 로그인 방법 선택지가 많습니다. 보통 회원 가입을 하려면 테이블을 생성해서 코드를 연결시켜서 사용을 하는데 firebase는 복잡하게 하지 않고 서비스를 제공해주기 때문에 사용이 편리합니다. 이메일과 구글은 클릭만 하면 설정이 끝납니다. 사전 설정은 깃허브 로그인 하시고 setting을 가셔서 dev -> OAuth에 접속을 하면 이미지와 같은 창이 뜨고 빈칸을 다 설정해주시면 아이디와 비밀번호를 두 번 째 사진 빈칸 부분에 넣어주시면 됩니다. 그러면 이렇게 3개의 로그인 방식을 제공한다고 보여줍니다. 먼저 email과 password가 잘 작동하는지 확인 합니다. 코드는 이..

Project (React) 2023. 9. 2. 14:00

firebase React와 연동하여 사용해보기

안녕하세요 홍 가 입니다. 오늘은 firebase를 사용해보려고 합니다. 프론트엔드 개발자는 프론트쪽만 공부하다 보니 서버 및 데이터 쪽이 어려우실 수 있어요 firebase는 그럴 때 사용하는 서비스입니다. 저도 요즘 면접을 보면서 느낀 점이 프론트 공고를 올려도 DB 쪽을 어느 정도 알아야 한다고 피드백을 많이 받아서 요즘 firebase 및 MySQL을 따로 공부하고 있습니다. firebase는 저희가 사용하기 쉽게 웹서버를 지원해 줍니다. 웹부터 앱까지 서버를 구현하지 않고 개발을 할 수 있습니다. 주로 게시판 및 웹 쇼핑몰 등등 많은 곳에 사용이 가능합니다. 저도 firebase를 통해 메신저를 만들어 보려고 합니다. Firebase | Google’s Mobile and Web App Deve..

Project (React) 2023. 9. 1. 14:58

추가 정보

인기글

최신글

페이징

이전
1
다음
TISTORY
홍가의 코딩공부 © Magazine Lab
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바