오늘은 개인프로젝트 제작을 하였다.혼자 작업을 하는거라 확실히 팀으로 작업하는거랑 조금 다른 느낌이 있었다.우선 개인프로젝트로 TMDB의 영화 데이터를 가지고와 영화 검색사이트를 제작하는 것을 목표로 프로젝트를 진행하였다.우선 TMDB에서 제공하는 OpenAPI를 가지고와야하는데다음과 같이 우측 상단의 Language를 우리가 쓸 언어인 Javascript로 바꾸어 주고 Fetch Request부분의 문구를 가지고와 Fetch해주면 데이터를 가지고 올 수 있다.다음과 같이 데이터를 가져오는 모습을 실행했을 경우 확인할 수 있다.해당 정보는 fetch('https://api.themoviedb.org/3/movie/top_rated?language=en-US&page=1', options) .then(r..
오늘은 몸이 좀 피곤한 날이였다..그래도 꾸준히 공부해서 성과를 내고 오늘은 프로젝트도 조금 준비해놔야한다.우선 공부를 마저해줬다, 실행 컨텍스트에 대해서 배웠는데실행 컨텍스트를 이해하기 위해선 우선 스택과 큐에 대한 개념을 배워야했다.STACK은 LIFO(Last In First Out) 이고, Queue 는 FIFO(First In First Out)이다.실행 컨텍스트는 그중 call Stack이기때문에 Stack의 구조를 따른다.실행컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다.실행 컨텍스트는 보통 함수로 구성된다. 우리는 전역변수나 eval을 안쓸것이기 때문에 함수 위주로 생각하면 된다.쉽게 말해서 위에서부터 아래로 순서대로 함수를 실행한다고 생각하면된다.실행 컨..
어제 학습했던 6-2일차까지 작성이 끝나고, 오늘 배운 7일차를 정리해보고자한다. 우선 시작하면서 ES6 문법을 공부하게 되었다. ES6문법은 2015년도에 개발되어 최신인 javascript문법이다. 함수를 등록하는 방법이 추가되었는데 기존 함수를 function add() { //로직 } 과 같이 작성했다면 //arrow function var add = (x) => { return 1 } var add = (x) => 1; arrow function을 이용하여서 간단하게 나열할수 있다. x자리에는 매개변수가 들어온다. 밑에 var add= (x) => 1; 과 같이 한줄로 간단하게 표현할 수도 있는데 이것은 return 1과 같이 한줄로 결과 값이 나오는 경우에만 가능하다. 그리고 데이터 영역과 변..
오늘은 TIL7일차가 되었다. 어느덧 순수 공부날만 7일이 되어서 9시부터 일어나서 학습하는 것이 익숙해지기 시작했다. 오늘도 최선을 다해 오늘 배운 것을 정리해보고자 한다. 어제 저녁에 학습하여 TIL에 못 넣은 부분이 있다. 어제 저녁에는 본격적으로 조건문 반복문 (for, while)등을 배웠다. 그래도 대학생 시절에 c, c++을 배운 것이 도움이 되어서 조건문과 반복문을 배우는 것이 크게 어렵지 않았다. 조건문과 반복문 둘다 사용법이 c와 같았는데 조건문(if) 의 경우 //if - else if - else 문 let x = 10; if (x = 0 && x 0부터 9까지 실행 될것이다. 다음과 같이 배열을 실행해서 로직을 이용가능하다. while도 예시가 쉬운데 let i = 3; while..
오늘은 자바스크립트 관련 학습영상을 보면서 자바스크립트 공부를 하였다. 자바스크립트는 자바와 이름이 자바와 비슷해 자바와 비슷한 언어라고 오해할 수 있지만, 자바와는 전혀 관련 없는 언어이다. 처음에 Livescript라는 언어로 시작되었다가, 자바가 너무 유명해서 이름을 자바스크립트로 짓자고 시작된 것이 자바스크립트이다. 자바스크립트는 웹관련으로 시작하게 되었다가, Node.js의 등장으로 fullstack언어로써의 역할 ( Frontend + Backend + DB) 을 함으로써 유행세를 타게 되었다. 자바스크립트 언어는 1. 객체지향 프로그래밍언어이다. 객체지향이란 데이터와 함수를 객체라는 그룹으로 묶어서 처리하는 프로그래밍이다. 2. 동적 타이핑 언어이다. 변수의 타입을 지정할 때 다른언어와는 다..
1주차 미니프로젝트를 마무리하면서 KPT(Keep, Problem, Try) 방법을 통해 요약 회고해보고자한다. 우선 Keep이다 - 우리 조는 최대한 분위기를 편안하게 만들고자 노력하였다. ●이는 내가 팀장인것도 있지만 서로 프로젝트를 하면서 최대한 마찰이 생기지 않을려면 분위기가 중요하다고 생각해서 최대한 말을 많이하고 무엇이든지 이야기하는 것이 우리 조가 미끄럽게 프로젝트를 할 수 있었던 이유인것 같아서 좋았다. - 우리 조는 최대한 분할 작업을 진행하였다. ● 다음과 같이 최대한 부분을 주어서 각자 역할을 하나씩은 맡게하여서 최대한 팀간의 일적인 부분에서 누구는 하고 누구는 안한다는 소리가 안나오도록 역할을 나눠서 작업하였던 것이 좋았던 것 같다. - 우리 조는 질문이 있으면 언제든지 할 수 있게..
내일배움캠프 어느덧 4일차 이제 하루에 12시간씩 공부하는 것은 어느정도 적응이 되어가는것 같다. 오늘은 미니프로젝트 마무리 작업을 하는 날인데 그래도 작업물이 만들어 지는 과정에 직접 참여하여서 작업을 하다보니 되게 보람차고 재밌는 것같다. 오늘은 여태껏 짠 코드들은 합치면서 소개 홈페이지를 만들었는데, 수정하기와 수정할 때 비밀번호를 확인해서 맞을 경우 수정이 되는식으로 진행되는 코드를 짜서 함께 짠 깃허브 코드안에 집어 넣었다. const data = await uploadBytes(imageRef, file) .then(async (res) => { await getDownloadURL(res.ref).then((url) => { editDto.imageUrl = url; }); await upd..
오늘은 미니프로젝트를 진행하는데에 있어 맡은 역할인 modal창과 수정하기 버튼을 구현하는데 집중하였다. 결론적으로 보자면 수정하기 버튼은 내일 마무리가 될 것같고, modal창은 구현이 되었다. 위의 버튼을 클릭하면 글쓰기 위한 가입하는 모달창을 오른쪽 사진처럼 띄우게 했다. $("#openbtn").click(async function () { var modalPop = $('.modal-wrap'); var modalBg = $('.modal-bg'); $(modalPop).show(); $(modalBg).show(); }) $("#cancelbtn").click(async function () { var modalPop = $('.modal-wrap'); var modalBg = $('.moda..