Enjoy Programming

4번쨰 css 레이아웃 챌린지는 이렇게 레이아웃을 잡는 챌린지였다. 짧게나마 코드 리뷰를 해야지.. 중점은 반응형으로 며개의 칼럼이 생기더라도 아래로 계속 이어 나갈수 있게 만드는 ? 암튼 반응형 페이지 만드는것 전체적으로 grid를 활용했다. html 코드는 반복반복이다 어짜피 같은 그리드가 계속 반복되니까 css 코드를 보면 챌린지 당시에는 이렇게 줬다는게... 멍청했다... 그냥 바디에 그리드 주고 auto-fit주면 되는건데... auto-fill과 auto-fit을 잘 이해하지 못했었다. 다시 짠다면 바디에 grid-template-columns를 repeat(auto-fit, minmax(Xxxpx, 1fr)요렇게 주고 로우는 필요한만큼 주고 auto-rows를 다시 주면 되고 헤더는 grid..

이번엔 데이터 베이스 관련 코드를 짜고 유저에게 영상을 보고 검색, 수정 삭제할 수 있게 해보자. 자 mongoose가 설치되었고 dotenv를 설치하자. dotenv란 node.js로 개발을 하면 port, DB관련 정보등 전역으로 필요한 여러 정보들이 존재한다. node.js에서는 dotenv패키지를 통해 환경변수 파일을 외부에 만들고 관리할 수 있다. 특히 , 깃허브등에 오픈소스로 프로젝트를 공개할때 DB계정 정보를 소스코드내에 하드코딩 하지 않고, 외부환경변수 파일에 작성하고 gitignore를 통해 제외하면 노출되지 않고 안전하다. 참고 - 환경변수란 OS입장에서 해당 프로세스를 실행시키기 위하여 참조하는 변수 - 컴퓨터로 하는 모든 작업들은 OS를 통해 실행되는 자식 프로세스인데 이프로세스들을..

lee code nico-code

자바스크립트 챌린지 3번째 이번 과제는 디데이를 출력하는 내용이다 기준은 크리스마스 이브를 기준으로 d-day계산 하기~ 우선 필요한건 크리스마스 날짜와 오늘 날짜. 자바스크립트에서 날짜를 구하는 함수는 Date(); 자바스크립트에서 date 객체를 생성하는 방법은 new연산자를 사용하는 것이 유일하다. 아래와 같이 크리스마스와 오늘날짜를 구한다 그리고 크리스마스와 오늘 날짜를 빼고 차이를 구한다 그리고 Math.floor를 이용하야 소수점 이하를 버리고 각 초 분 시간 날짜를 구해준다. 그리고 구해진 시 분 초를 다시 한번 초분은 60으로 나눈 나머지 값을 시간은 24로 나눈 나머지 값을 변수에 담아주고 삼항 연산자를 이용해 각 숫자가 10이하 일때는 앞에 0을 붙여주고 아니면 그냥 그대로 출력하도록 ..

arrow function은 간결하고 유용하지만 사용하지 않아야 할 때가 있다. 바로 this 키워드를 사용해야 할때이다. this란 무엇인가. 먼저 this를 간단하게 집고 넘어가자 this는 객체와 연관이 깊다. 예를 들어 const a = {name: "lee"} 라는 객체가 있고, 특정 상황을 만족할 경우 this.name을 호출하면 "lee"가 출력이 된다. 이때 변수 a를 this의 context object라고 할 수 있다. 여기서 context object란 this가 바라보고 있는 어떤 객체라고 생각하면 될 듯 하다. 크게 4가지 패턴이 있는데 1. 일반함수 실행: 함수 실행에서의 this는 전역객체(window)이다 2. 메소드 실행 : 메소드란, 객체의 속성으로 정의된 함수. 이 경우..

자 이제 데이터베이스를 쓸 db를 설치하자 이미 flask를 잠시 경험할때 mongodb를 설치해서 사용해 봤다. window환경에서 그냥 다운로드하고 설치후 robo 3t를 설치해서 사용했다. 또 파이썬 환경에서 pip로 pymongo를 설치후 사용했기에 그냥 썼다..ㅎㅎㅎ 이제 맥으로 넘어온 나에게 유닉스 계열의 설치는 살짝 어려운 감이 있지만 검색은 최고다. 난 homebrew를 통해 설치하고 .zshrc를 수정해서 alias설정을 해줬다. 자세한 방법은 zellwk.com/blog/install-mongodb/ Installing MongoDB on Mac (Catalina and non-Catalina) | Zell Liew Installing MongoDB on Mac (Catalina and..