분류 전체보기 (104) 썸네일형 리스트형 2021년 5월 30일 #4 weather app + todo app에 animation 적용하기(미완) 2021년 5월 26일 #3 weather app + todo app 만들기 with React (미완) 지난 5월 23일부터 react를 연습하기 위해 초보자들이라면 반드시 만들어야하는 weather app을 만들기 시작했다. 어렵기만하던 react가 재밌게 느껴졌다. (역시 이론만 배우면 재미가 없다. 자발적 의 bedeveloper.tistory.com 기존 만들었던 앱에다가 애니메이션과 react-router-dom을 통한 화면전환을 구현해 보았다. 화면전환 효과가 더욱 두드러지게 하기 위해 header를 만들었다. 상상했던 모습을 대부분 구현할 수 있었으나 몇가지 문제점이 있었으니.... 문제점을 적기 전에 우선 결과물부터 보자. *일단 입력했었던 결과가 유지가 되지 않는다. 이 부분은 Loca.. 2021년 5월 26일 #3 weather app + todo app 만들기 with React (미완) 지난 5월 23일부터 react를 연습하기 위해 초보자들이라면 반드시 만들어야하는 weather app을 만들기 시작했다. 어렵기만하던 react가 재밌게 느껴졌다. (역시 이론만 배우면 재미가 없다. 자발적 의지로 뭔가 만들어야 재미를 느끼는 것 같다. ) 좋아... todo app에 weather app을 더해보자는 생각이 들었다. weather app + todo app의 조합은 참을 수 없지 않겠는가? 아래 결과물을 보자. 구현할 때 집중했던 부분은 아래와 같다. fetch()를 통해 날씨 정보와 배경화면을 받아오는 것 useState와 삼항연산자를 통해 className에 변화를 주어 toggle효과를 구현해 보는 것(도시 날씨를 클릭하면 해당 창을 확대 해준다.) 내일부터는 화면전환을 시도해보.. 2021년 5월 22일 프로그래머스(약수의 개수와 덧셈) 약수의 개수와 덧셈 //내가 작성한 코드 function solution(left, right) { let result = ''; let count = 0; for(let i = left; i 2021년 5월 19일 프로그래머스(가운데 글자 가져오기, K번째수) K번째수 //내가 작성한 코드 function solution(array, commands) { var answer = []; for(let i = 0; i < commands.length; i ++){ answer.push(array.slice(commands[i][0]-1, commands[i][1]).sort(function(a, b) {return a - b;})[commands[i][2]-1]); } return answer; } 어려운 문제는 아니지만 얼마나 효율적으로 풀 수 있냐를 판단하는 문제라고 생각했다. 효율적인면에서 그리고 제 3자가 보기에 최악의 코드로 문제를 풀어냈다. 통과는 했지만..이게 무슨 의미가 있나 싶다. 다른 사람이 쓴 코드를 보고 현타가 왔다. function solu.. 2021년 5월 18일 코드스테이츠 DAY-44 fetch API 예습 및 응용 예제(랜덤 고양이 생성하기) 만들어보기(feat. vanilla javascript) 동기 비동기 스프린트가 끝나고 다음 일정을 확인해보니 fetch API가 있었다. UR클래스 상의 fetch API를 활자로만 보니 너무너무 재미없었다. 사실 API라는 것을 활용하면 참 많은 것을 할 수 있을 텐데...라는 생각이 들었고 진짜배기 fetch API를 온몸으로 느끼기 위하여 API를 받아오는 것부터 시작하여 API를 받아서 바로 웹브라우저에 넣는 실험 그리고 유튜브에 재밌어 보이는 예제가 있어서 그 예제를 구현해보는 것 까지 공부를 진행하게 되었다. 일단 fetch API가 뭔지 알아보기 위해 UR클래스에서 시키는 대로 진행을 했다. let url = 'https://v1.nocodeapi.com/codestates/google_sheets/YbFMAAgOPgIwEXUU?tabId=최신뉴.. 2021년 5월 16일 코드스테이츠 DAY-42 동기, 비동기 예습 드림코딩 엘리님의 설명을 받아 적으며 학습한 내용임을 안내드립니다. 1. 동기와 비동기의 차이점 자바스크립트는 동기적이다. => 호이스팅(var변수와 함수선언이 자동적으로 제일 위로 올라가는 현상)이 된 이후부터 코드가 작성순서에 맞추어 차례대로 실행된다는 말. 비동기라는 말 : 언제 코드가 실행될 지 예측할 수 없다는 말. (ex: setTimeout을 이용한 경우 비동기적인 실행방법) setTimeout(function(){ console.log('Hello World'); }, 1000) 콜백함수 : ('Hello World')를 console.log하는 setTimeout안의 함수는 바로 실행되는 것이 아니라, setTimeout이라는 함수의 parameter(인자)로서 지정한 시간 이후에 실행된.. 2021년 5월 16일 코드스테이츠 DAY-42 자료구조 코플릿 문제 저번주 목요일(5. 13. ~ 5. 15.)부터 블로깅을 하지 않았다. 자료구조에서 매우 절었기 때문인데 개념을 이해했다고 생각했으나 코플릿을 통해 응용하는 과정에서는 맥을 못추었다. 침착하게 다시 돌아보는 와중에 14일에 풀지 못했던 문제를 푸는 과정 중 AHA 모먼트가 있었던 것을 적어보고자 한다. 인접행렬에서 정점과 정점이 이어져 있는지 여부를 반환하는 문제였고 스프린트 리뷰시간에서 코드스테이츠 스태프는 이 문제를 큐로 풀었다는데 글쎄... 나는 이 문제는 재귀로 해결하여야한다라고 생각했다. 첫번째 시도 function getDirections(matrix, from, to) { //범위를 초과해서 from과 to가 입력되면 false를 리턴 if (from + 1 > matrix.length ||.. 2021년 5월 12일 코드스테이츠 DAY-38 JSON.stringify 구현 관련 정리 JSON.stringify를 함수로 구현해보는 스프린트와 재귀함수를 이용하여 Tree UI를 만드는 스프린트의 리뷰 시간에 스스로 정리해보면 좋을 질문을 주었고 이에 스스로 답을 해보고자 한다. 왜 우리는 배열과 객체를 원시타입과 똑같은 방식으로 문자열화를 시키면 안 되는가? 원시타입을 문자열로 바꾸는 메소드인 String()을 사용하면 어떻게 나오는지 코드로 확인해보자. let arr = [1, 2, 3] undefined String(arr) "1,2,3" //괄호가 벗겨진, 즉 더 이상 배열임을 알아차릴 수 없는 상태가 되었다. let obj = { name : 'Charles', age : 29, job : 'developer' } undefined String(obj) "[object Objec.. 이전 1 ··· 5 6 7 8 9 10 11 ··· 13 다음
