TIL

모든 상황에 의문을 가져라모든 질문에 의문을 가져라모든 해답에 의문을 가져라생각하는 힘을 기르는 것이 경쟁력 있다.

Js의 논리연산자 and / or / !(not)and 연산자 &&둘다 참이어야 true아니라면 false/true && true = truetrue && false = falsefalse && true = falsefalse && false = false/or 연산자

if문 예제를 풀어보면서 코드를 줄일 수 있는 방법들을 터득하게되었다. if~else구문의 리턴값을 boolean타입으로 받는다면 이를 비교연산자를 통해 엄청나게 간단하게 만들 수 있다!위 코드를 아래와 같이 줄일 수 있다.위 코드를 아래와 같이 줄일 수 있다.위 코드

til 4일차의 새로 알게 된 것들!

오늘 문제를 풀다가 if안에 조건식이 참인데도 {}안의 식을 실행하지 않아서 뭔가 이상해서 찾아봤더니..true라는 값을 리턴 받으려면 a를 Boolean 타입으로 바꾸거나 if(a) 라고 하면 된다는 걸 알아냈다.a == true 와 a === true 는 잘못된 비

조건문/문자열은 이제 막힘없이 쭉쭉 풀 수 있는데 반복문이 문제다그래도 어제보단 덜 헷갈리고 어떻게 푸는지 알게되었다.예를들어 위와같이 나타내고싶으면 시간이 좀 걸리지만 위와같이 구현해낼 수 있게 됐다.

parseInt()는 소숫점을 버리는 것이고 Math.floor는 소숫점을 내리는 것 이다.parseInt(123.12), Math.floor(123.12)를 하면 둘다 123이 나오지만숫자가 음수 일땐 다른 결과값을 가져온다parseInt(-1.5) 는 -1 를Mat

CSS의 사용목적을 이해할 수 있다.\-> O html만 가지고선 디자인이나 레이아웃을 설정하는데 한계가 있기 때문에 CSS를 사용한다 CSS는 Cascading Style Sheets의 약자이다. 선택자를 사용할때 cascading을 생각하면서 해야된다!

이렇게 열심히.. 해놓고 마지막 오류를 끝까지 수정을 못했다..오늘 배운 것은 로직을 바보같이 짜면 밑으로 갈 수록 산 넘어 산, 꼬여버린 실타래처럼 되어버린다는 것 이다.로직이 약하면 새로운 조건이 하나씩 추가될때마다 추가해야될 변수가 또 생기고 그러다 오류가 새기면

오늘은 정말 새로운 개념들을 끝없이 배웠다! 개발자에 한층 더 가까워진 기분이라 너무 즐겁고 재미있다!!!근30년을 살아오면서 공부가 이렇게까지 재밌었던적이 없었는데.. 하루라도 더 빨리 시작해볼걸 후회가된다

기억해야 할 6지 단계 1\. fork2\. clone 또는 init3\. add4\. commit5\. push6\. pull request 이 6가지만 알고 기억하면 더 이상 git에 대해서 헷갈릴 일은 없을 것 같다. fork를 통해 나의 원격 repository

git의 Workflow 이해하기

어제 git에 대해 제대로 배운 기념으로 미뤄뒀던 toy 프로젝트들을 시작했다.하루에 10~12시간씩 컴퓨터 앞에 앉아 있다보니 자세가 계속 구부정해지고 거북목이 되어가는 것이 느껴져서틈틈이 스트레칭을 하기위해서 앱을 만들기 시작했다. 나와 같이 컴퓨터 앞에 오래 앉아

index, element, length arr0, push, pop예를들어 arr = 사과,바나나,배,귤 이면arri 는 i+1번째 element를 반환 , 예를들어 arr2는 '배'를 반환한다. index는 0부터 세기때문!arr.push(수박) 을 입력하면 ar

Achievement Goals 객체 기초, 퀴즈, 실습 배열과 객체의 구조를 이해하고 언제, 어떻게 사용하는 지 이해할 수 있다. 배열과 객체의 특징을 구분하여 사용할 수 있다. (순서를 가진다, 의미를 가진다) 배열과 객체의 특징에 따라 실생활에서 언제 쓰는지 이해

다양한 CSS 셀렉터 규칙을 이해할 수 있다.셀렉터h1 { } , div { }전체 셀렉터\* { }Tag 셀렉터 section, h1 { }ID 셀렉터class 셀렉터 .widget { } , .center { }attribute 셀렉터 (암기x) ahref { }p

https://stackoverflow.com/questions/7314635/why-isnt-1-2-3-equal-to-itself-in-javascript let myArray = [2, 3, 4, 5]; let ourArray = myArray; ourArray

Spread 문법여기서 sum(...number)는 x,y,z에 1,2,3이 차례대로 들어가서 1+2+3 이 된다.이처럼 Spread문법은 배열을 풀어서 인자로 전달하거나, 각각의 요소로 넣을때 사용된다. 이처럼 spread 문법을 사용해서 배열에 배열을 넣을 수 도

value1을 불러오고 싶다면 Array3 , value2를 불러오고 싶다면 Array3 또는 Array3.value2 b를 불러오고 싶다면 Array4pop과 shift는 뽑힌 친구들을push와 unshift는 들어가고 난 후 새로운 배열의 총 길이를 리턴한다 a

https://www.zerocho.com/category/JavaScript/post/5b2b45cf1350f9001b662ba6 https://yoonjong-park.tistory.com/entry/addEventListener-%EC%9D%B4%EB%B2%A4

오늘은 어제 했던 과제를 처음부터 끝까지 백지에서부터 다시 작성해보고 기능을 몇개 더 추가해 보았다.아래는 작성한 코드이다.

Achievement Goals 일급 객체(first-class citizen)의 세 가지 특징을 설명할 수 있다. > 1. 변수에 할당할 수 있다. > 2. 다른 인자로 전달될 수 있다. > 3. 다른 함수의 리턴값이 될 수 있다. 고차 함수(higher-order

React의 3가지 특징에 대해서 이해하고, 설명할 수 있다.Component JSXVirtual DOMJSX JavaScript XML의 줄임말이며 UI를 구성할 때 사용하는 문법으로 JavaScipt를 확장한 문법이다. (React에서 JSX를 안쓰면 시체! Rea

SPA(Single-Page Application) 개념을 이해하고 설명할 수 있다.SPA가 나오기 이전엔 웹사이트에서 웹사이트 내의 다른 페이지로 이동하면 브라우저가 페이지를 보여주기 위해 매번 HTML 파일로 된 페이지 전체를 서버로부터 받아와 사용자에게 뿌려줘야만

오늘은 알고리즘 1 부터 10까지를 풀었다. https://velog.io/@developerjhp/%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%981-Two-Sumhttps://velog.io/@developerjhp/%EC%95%8

state, props의 개념에 대해서 이해하고, 실제 프로젝트에 바르게 적용할 수 있다.state는 컴포넌트내에서 변하는 값 값이 변하면 리렌더링된다. 리액트의 핵심 props는 하위 컴포넌트내에서 변하지 않는 값(읽기 전용)React 함수 컴포넌트(React Fu

밥도 못먹고 9시부터 시작된 SECTION1 HA 시험은 14시 10분에 끝냈다..뭐가이렇게 어렵냐!! 그래도 통과못하거나 문제를 다 못 풀까봐 걱정했었는데 노력은 배신하지 않나보다 내일은 리액트 시험이 있으니까 점심먹고 조금 쉬었다가 프로그래머스 2020 프론트엔드

아..마지막 테스트 하나 통과가 안됐다. 뭐가 잘못된건지 하나도 모르겠다.. 리렌더링 되었을때 초기값이 전달안되어서 그런건가 했는데 초기값 images0으로 잘 줬는데.. TypeError: Cannot read property 'alt' of undefined 왜 이

주말에 이틀에 걸쳐서 알고리즘을 풀었었는데 바빠서 TIL작성을 못했었다.C언어의 goto.. JS에서는? label!!label은 break나 continue가 들어갈 수 있는 자리에만 들어갈 수 있다알고리즘 26 - Pete, the baker알고리즘 27 - Sim

Achievement Goals 클래스와 인스턴스라는 용어를 이해할 수 있다. > new 키워드의 사용법을 이해할 수 있다. > class 키워드의 사용법을 이해할 수 있다. > 현실 세계의 모델을 바탕으로 클래스의 메소드와 속성을 디자인할 수 있다. > 객체 지향 프

재귀의 의미에 대해서 이해하고, 자바스크립트에서 재귀 호출을 할 수 있다. 예를들어, 1부터 n번째 수 까지 더하는 함수를 만들라고 했을때 처럼 for문을 통해 나타낼 수 있지만 이 for문을 재귀함수로 나타낼 수도 있다. 모든 반복문은 재귀함수로 치환할 수 있다.재귀

JSON 구조가 재귀 함수를 사용할 수 있는 Tree 구조임을 이해할 수 있다. (stringifyJSON) OJSON.stringify 와 JSON.parse 가 seriealize, deserialize라는 것을 이해할 수 있다.OJSON.stringify 와 JS

자료구조란 여러 데이터들의 묶음을 저장하고, 사용하는 방법을 정의한 것이다.자료구조의 목적은 명확하다. 자료를 더 효율적으로 저장하고, 관리하기 위해 사용하며, 잘 선택된 자료구조는 실행시간을 단축시켜주거나 메모리를 절약할 수 있다. 추상화 효율성재사용성선형구조배열(A

오늘은 머리좀 식힐겸 알고리즘만 풀었다. 포스팅하지 않은 쉬운문제들까지 합치면 40문제정도 푼 것 같다. 이제 7,8kyu문제는 보자마자 30초안에 풀 수 있다. 6kyu는 2분? 5kyu는 5분정도 걸리는 것 같다.알고리즘을 79번부터 94번까지 풀었다. 포스팅하지

여러개의 점들이 서로 복잡하게 연결되어 있는 관계를 표현한 자료구조각 원은 vertex(정점) , 각 선은 edge(간선)라고 표현한다.undirected graphdirected graph단방향 그래프 : 방향성이 있어서 vertex1에서 vertex2로 가는것이 가

오늘은 Lodash를 직접 만들어 봤다. 메서드를 만들어준 개발자에게 한 없이 감사함을 가지게 된 하루였다.언어의 발전은 메서드에서 시작되는 것이 아닌가 생각도 하게 되었었다.나도 나중에 나만의 메서드를 만들어서 현업에서 써먹어야지.

(왼쪽이 동기, 오른쪽이 비동기)동기는 서버에 요청을 보내고나서 서버가 요청을 해석하여 다시 클라이언트에 응답할때 까지 멈추게 된다.반면에, 비동기는 서버에 요청을 보내고 서버가 요청을 해석하여 다시 보낼 때 까지 나머지 프로세스를 진행한다.동기는 전화\-> 하던 일을

비동기 요청의 가장 대표적인 사례는 네트워크 요청이다.네트워크를 통해 이뤄지는 요청은 형태가 다양한데 그 중 URL로 요청하는 경우가 대부분이다.URL로 요청하는 걸 가능하게 해주는 API(Application Programming Interface)가 fetch AP

클라이언트-서버 콘셉트를 이해할 수 있다.리소스가 존재하는 곳과 리소스를 사용하는 앱을 분리시킨 것을 2-Tier 아키텍처 또는 클라이언트-서버 아키텍처라고 부른다.보통의 서버는 리소스를 전달해줄 뿐, 리소스를 저장하는 공간은 데이터베이스라는 창고에 둔다. 이처럼,

REST API에 대해 이해할 수 있다.“Representational State Transfer”의 약자로 로이 필딩의 박사학위 논문에서 웹(http)의 장점을 최대한 활용할 수 있는 아키텍처로써 처음 소개되었다. REST API는 웹에서 사용되는 모든 자원을 HTT

React에서의 데이터 흐름, 단방향 데이터 흐름을 이해할 수 있다.React 개발 방식의 가장 큰 특징은 페이지 단위가 아닌 컴포넌트 단위로 시작한다는 점이다. 컴포넌트를 만들고 나서 페이지를 조립해 나간다. 즉 상향식(bottom-up)으로 개발을 해나가게 된다.

HTTP 요청/응답을 브라우저를 통해 확인할 수 있고, 해당 내용을 읽을 수 있다. POSTMAN으로 get/post/delete/put CRUD를 수행하면 된다. HTTP 다양한 요청 방식과, 응답 코드에 대해 이해할 수 있다.https://velog.io/

cs50 2주차 강의를 들었다. 내일은 시간나면 3주차 강의를 듣고 백준 문제들을 풀어 볼 예정이다.문자열을 나타날땐 str256으로 크기를 지정해줘야 하는데 cs50에서는 cs50.h 라이브러리를 이용해서 get_string('')으로 값을 받아와 일련의 과정 없이

오늘은 style Component를 이용해서 모달/토글스위치/탭/태그를 만들었다. 별 생각없이 사용했던 여러 기능들이 실은 이렇게 긴 코드들로 이루어져 있구나. 되게 쉽게 만들었을거라 생각했는데 전혀 아니었구나!! 만들다보니 css까지 구현하는게 좀 힘들었다. 나는

오늘은 드랍다운이랑 자동완성을 구현했다. css는 싫은데 리액트는 재밌다 일단 TIL을 써놓고 남은 시간동안 c언어를 공부해야겠다.

평문으로 서버와 클라이언트가 통신하다보니 통신중 데이터가 탈취당하면 모든게 노출된다데이터를 암호화하여 통신할 필요성이 생겼다암호키를 생성하여 데이터를 암호화 하여 보내고, 암호키를 통해 데이터를 복호화 하여 해석한다서버와 클라이언트가 같은 암호키를 가져야 한다암호키를

폴더인지 파일인지 확인하기파일 helloworld.js는 -rw-r--r--이라고 출력되었고, 폴더 linux는 drwxr-xr-x라고 출력되어있다. 제일 앞 글자는 파일인지, 폴더인지를 의미하는데 -일 경우 파일을, d일경우 폴더를 의미한다. 이어지는 r,w,x는 각

오늘은 그리디 알고리즘, dp 알고리즘을 공부했다. 그리고 프로젝트 개발을 진행했다. 6명으로 1팀은 todo 2팀은 reminder를 개발 하고 있는데시작하기 전엔 작업량이 굉장히 많을 것 같았는데 막상 해보니 그 많은 작업량도 몇시간내에 끝내게 되더라.. 역시 사람

(기획이미지 01-1. NewTodo)우선 기획서대로 작동이 되는 목업을 먼저 만들었다.타임테이블을 만들어야했는데 직접 만드는 것은 시간도 많이 걸리고 좀 어려워서 react-rainbow-componet에 있는 TimePicker를 사용했다.new Date로 받아오는

마감시간 설정을 누르면 10분점 미리알림과, TimePicker컴포넌트가 뜨게 수정했다. 이 과정에서 엣지케이스가 굉장히 많았다.1\. 입력창에 아무것도 입력하지 않고 생성버튼을 눌러도 투두가 생성됨.2\. 마감시간 설정을 누르고 취소를 눌렀다가 다시 +버튼을 누를경

Todo에서 map으로 뿌려준 element들에 대해 edit아이콘을 누르면 해당하는 id를 가진 element를 수정해서 다시 TodoListDummy에 뿌려주는 TodoEdit컴포넌트를 추가했다. 눈으로 보기엔 굉장히 쉬워보이지만 실제 구현하는 과정에서 수 많은 오

사실 매일매일 프젝을 해왔는데 업로드할 짬이 안나서 게시글을 쓰지 못했었다.이것저것 엄청나게 많은 오류들을 접하였고.. 렌더링이 어떻게 되는지 처음부터 생각해보고 컴포넌트로 만들었다가 함수로 만들었다가..해보고.. 모듈까지 고쳐보고.. 아무튼 엄청나게 많은 오류들을 핸

3 Tier Architecture 를 이해한다.영속성의 개념을 이해하고, 데이터베이스의 필요성을 인지한다.데이터를 인메모리 형태로 임시저장하거나, 파일에 저장하는 방법으로 데이터를 저장할 수 있는데, 굳이 데이터베이스를 사용하는 이유는 무엇일까? In-MemoryJa

점심 1시간 저녁 2시간 중간휴식 30분 정도 제외하면 사실상 매일 10시간 30분~11시간 씩 프로젝트를 하고있다.. 오늘은 어찌어찌 기획을 다 하고 DB스키마를 짯다. 볼륨이 왜이렇게 커.. 오늘부터 일기를 짤막짤막하게라도 써야겠다. 그래야 나중에 돌아봤을때 4주동

오늘은 제목을 조금 오타쿠같이 해봤다. 기획을 하고나서 프론트 3명 + 백 1명이서 검수하는 과정에서 유저가 할 수 있는 모든 경우의 수를 계산하면서 디테일을 살리는 과정을 약 3일간 진행했는데 이럴 시간이 없다는 걸 알면서도 디테일이 없다면 차라리 안만들고 만다는 마

오늘도 죽다살아났따. 낼부턴 코드칠 수 있다!! 무야호..처음하는 타입스크립트 프로젝트라 익숙해질 수 있을지 의문이 들긴한다!!.. !!!!두달뒤엔 취업할 수 있으리라 믿으면서 열심히 달려나가야지! 오늘 배운 것 장바구니는 로컬스토리지에, 오더페이지에선 오더목록에 있는

그림쇼핑몰의 어드민페이지를 구현하고 있는데 명색이 쇼핑몰이다보니 데이터구조가 상당히 복잡하여 get요청 하는데 굉장히 힘들었다.. 거기다 이제 막 개발을 시작한 프로젝트다 보니 더미데이터도 없어서 회원가입/로그인 으로 토큰을 가져오고 해당 유저로 그림을 주문한 후 해당

오늘은 모든 유저의 주문목록을 볼 수 있고 진행상태(결제취소,반품,배송준비,배송중,배송완료)를 변경 할 수 있는 어드민페이지를 제작했다. 타입스크립트 + API + 배열객체지옥을 헤치느냐고 오래걸렸다.table태그로 관리자페이지를 만들었는데 데이터를 map으로 뿌려줄때

와..오늘은 진짜 머리가 너무 아팠다. http 배포는 15분만에 끝냈었는데 https 배포랑 배포자동화에서 엄청나게 시간이 소비됐었다. https는 그럭저럭 어렵지 않았는데 배포자동화가 정말 헬이었다. 처음엔 aws codeDeploy로 해결하려 했지만 안돼서 git

(어드민작품관리페이지 디자인초안)오늘은 배포자동화를 끝마치고 cloudfront의 cache invalidation을 자동화했다. 그리고 어드민작품관리페이지를 거의 다 만들었다. 작품수정시 모달 + 나머지기능만 구현하면 되는데 오늘 이래저래 휴식을 많이 취하다보니 예정

주문했던 책상이 오늘 13시경에 왔다. 책상을 버리고나서 그동안 침대와 쇼파와 식탁을 배회하며 코딩을 했었는데 드디어.. 책상이...ㅠㅠ 너무 좋다. 큰맘 먹고 1800x800사이즈로 질렀다!! 역시 책상은 클수록 좋구나!! 오늘은 어드민페이지 중 작품관리,유저관리 페

드디어 어드민 페이지 구현을 끝냈다.(배너관리는 우선순위가 떨어져서 아직 구현하지 않았다.) 데이터가 굉장히 복잡하게 얽혀있어서 db에 수작업으로 밀어넣는게 불가능해져서 어드민페이지 구현을 1순위로 하기로 했었다. ui신경안쓰고 만들거라 하루이틀이면 다 만들 수 있을거

이게 얼마만에 css를 만지는거야..? 기능구현만 하다가 css만지려고하니까 머리가 지끈지끈하다. 특히 저 이미지의 해상도를 유지하면서 일정크기를 맞추는게 힘들었는데 이건 object-fit: cover을 주면 되더라!! 너무 신기했다. ㅎㅎ미디어쿼리까지 같이 고민해

오늘은 작가상세페이지를 구현하였다. 구현하면서 재밌었던것들 몇가지를 적어보려고한다. 반응형에 따라 이미지를 정사각형으로 표현하는걸 어떻게 할 지 몰라 굉장히 고민 했었는데 이렇게 해결하면 되는 거 였다. 판매 중인 작품 우선 보기를 구현하기 위해서 판매작품은 가장 뒤로

오늘은 각종 오류들을 수정했다.이 문제는 catch부분에서 예외처리를 안해줘서 일어나는 문제였다. 그래서 위와 같이 catch문에 예외처리를 해줬다. 근데, 로그아웃으로 해결할 게 아니라, 각 페이지에 들어갔을때 토큰이 유효한지 확인하고 유효하지 않다면 강제로 로그아웃

작품리스트내에 필터링이란 컴포넌트를 만들고 작품리스트에서 필터링핸들링을 props로 내려줘서 바뀐 필터를 요청하게 해놨다. 처음엔 작품목록을 아트리스트 컴포넌트 안에서 바로 뿌려줬었는데 이러면 하트에 대한 상태가 따로따로 관리가 안되어서 작품 하나하나를 컴포넌트로 만들

헤더 현재페이지 볼드처리어드민페이지 코드,css 수정서버product컨트롤러 수정Users 타입 수정랜딩페이지 회원가입버튼 로그인시 마이페이지로변경모든 axios요청실패시 에러페이지로 리다이렉트토큰만료시 로그인페이지로 리다이렉트홈 작가보러가기 버튼 링킹안되는 문제 해결

Feat 결제보안기능 구현Fix소셜로그인 로그인시 이전페이지로Fix kakao oauth 안되는 에러 해결 Fix 필터링시 페이지오류 수정Feat카카오 상담기능 추가Fix 어드민유저 페이지 수정 Fix 어드민작품등록 수정 Fix 로그인시 이전페이지로 가기, 로그아웃시

나는 스프린트를 겪기 전까지는 회의하면서도 그저 "오버커뮤니케이션 하면 뭐라도 나오겠지", "시간을 많\~~이 투자하면 어느정도 아이디어는 나오겠지" 라고 생각했었다. 그런데 구글 스프린트를 겪고나니 내가 여태 했던 모든 회의는 시간낭비였다고 느껴졌다. 세상에 이렇게

리뷰들을 보니 나 정말 열심히 했구나. 어디가서 열심히 했다고 말할 순 있겠구나 싶었다.

“Most web performance metrics and resources are developed with a privileged user in mind.”200ms ⇒ 100ms 로 줄어들었을때 매출에 얼마나 영향을 미치는가를 알 수 있어야한다.웹사이트에서 병목