본문 바로가기

분류 전체보기

(90)
내일배움캠프 Week 4 내일 드디어 프로젝트 발표 날 CRUD 는 전부 기능 구현에 성공 하였다 다만 몇몇 페이지는 SPA 로 구현하기 어려워서 따로 페이지를 만들었다 .. 프로젝트가 끝나도 이건 추후에 다시 만들어 볼 것이다 또한 수정 페이지 에서 이전에 등록되어있는 DB들을 불러오는 건 성공을 했지만 이미지파일에서 문제가 발생했다 .. 이것도 추후에 꼭 다시 보자 가장 마음에 든 나의 함수는 이미지 업로드 작업 이다. export const uploading = async (event) => { //이미지 업로드를 위한 상수 선언 const imgFile = document.querySelector("#image").files[0]; const storageRef = ref(storageService, "post_image..
내일배움캠프 Day 20 프로젝트 막바지 단계... 기능구현은 왠만큼 했으니 이제는 짜잘한 녀석을 손봐야 겠다. 수정 삭제 기능은 파이어베이스 규칙에서 등록글 아이디 값과 현재 로그인한 유저의 아이디값이 같아야만 가능하게 했다. rules_version = '2'; service cloud.firestore { match /databases/{database}/documents { match /{document=**} { allow read: if true; /// 누구나 읽을 수 있음 } match /post/{docid} { allow read : if true ; allow create: if request.auth != null; //생성은 로그인한 사람만 allow update,delete: if request.auth..
내일배움캠프 Day 19 Firebase version 9 version8 과 version9 은 다른 문법을 써야 했음 이미지 와 DB 업로드 하려면 일단 기능들 땡겨오고.. import { storageService } from "./firebase.js"; import { dbService } from "./firebase.js"; import { authService } from "./firebase.js"; //파이어베이스 js 를 따로 만들어 놨음 import { ref, uploadString, getDownloadURL, deleteObject, uploadBytes, uploadBytesResumable } from "https://www.gstatic.com/firebasejs/9.14.0/firebase-st..
내일배움캠프 Day 18 파이어 베이스 너무 어렵다.. 하... 거기다가 async는 뭐고 await 는 뭐고 promise 또 뭔지... 가르쳐준적 없자나요... ㅠㅠㅠ 오늘 열심히 공부해봐야겠다
내일배움캠프 Day 17 Firebase 데이터 쓰기 (DB저장) Firebase 데이터베이스에 저장하려면 const db = firebase.firestore(); db.collection('컬렉션명').doc('문서명').set({ 제목 : '제목' }) 만약 문서명을 따로 지정하지 않겠다면 const db = firebase.firestore(); db.collection('컬렉션명').add({ 제목 : '제목명' }) 이런식으로 .doc가 아니라 .add로 사용한다. .add는 문서명을 자동으로 부여한다. 이것을 활용하여 특정 버튼을 눌렀을때 해당 내용이 DB 로 저장 되게끔 하려면 //제이쿼리 사용의 경우 $('#ID명').click(function(){ const DB에저장할내용 = { 제목 : $('#title')..
내일배움캠프 Day 16 Firebase 데이터 가지고 오기 Firebase는 서버없이도 웹서비스/앱서비스를 만들 수 있게 도와주는 서비스 백엔드 작업을 안해도 되서 프론트엔드 개발자 입장에서는 개발시간을 매우 단축시킬 수 있음 Firebase Database에서 데이터를 읽으려면 db.collection('컬렉션이름').get().then(()=>{}) 컬렉션 안에 있는 모든 데이터를 출력 하려면 forEach() 반복문을 사용 여기서 원하는 HTML 파일에 출력하려면 상수 지정 하는 템플릿을 만 든뒤 .append(템플릿)
내일배움캠프 Week 3 캠프들어온지 벌써 3주가 지났다 ... 하루 12시간 을 3주동안 채웠다는게 나 자신이 자랑스럽다 지금까지 무엇을 배웠을까 리스트업 해봤다. 자바스크립트 기초 파이썬 기초(매우 기초) HTML 기초 CSS 기초 깃 기초 몽고DB 간단 사용법 아직은 뒤에 다 기초 가 붙지만 심화로 바뀌는 날이 하루 빨리 왔으면 좋겠다. ! 잘하고 있다 화이팅 !
내일배움캠프 Day 15 NPM (Node Pacakge Manager) 이란? NPM 을 알기위해선 먼저 CLI 에 대해서 알아야한다. CLI (Command-Line-Interface) 란? 명령어를 통해서 컴퓨터를 제어하는 방식이다 ( 까만화면에 흰글씨로 명령하는거 ) 반대는 GUI NPM node.js라는 시스템을 통해서 동작하는 여러 프로그램을 관리해주는 소프트웨어 NPM을 이용하면 내가 원하는 프로그램을 설치 삭제 검색 업데이트가 가능하다. 이렇게 설치된 프로그램은 독립적으로 실행되는 것도 있지만, 다른프로그램의 작은 부품으로써 사용되기도 한다. 노드.js 를 설치후에 윈도우:cmd // 맥: 터미널에서 node -v 입력하면 설치된 버전이 확인 가능하다. npm 을 입력하면 메뉴얼이 나온다. npm 을 이용하는 방법..