profile
좋은 개발자, 좋은 사람
post-thumbnail

포포를 찾아라 미니 게임 만들기(3)

모바일에서도 잘 동작하도록 CSS를 수정했다. 확실히 반응형으로 만드는 것이 살아있는 프로젝트처럼 보여서 좋지만, PC로 버벅임 없이 구현되던 것이 모바일에서는 잘 버벅인다.

약 17시간 전
·
0개의 댓글
post-thumbnail

[ 프로그래머스 코테 연습] - 2주차_상호평가

메소드를 사용하기 전에 반복문으로 구현할 수 있어야 `문제 해결 능력`을 키울 수 있다는 조언을 받아들여, sort 함수도 쓰지 않으려 한다.

4일 전
·
0개의 댓글
post-thumbnail

웹툰 취향 테스트 만들기(1)

netlify 배포가 처음이라 많이 헤맸다. Live server 로 확인할 땐 결과 화면이 너무 빠르게 나와서, 기다리는 재미를 위해 "분석중" 애니매이션을 넣어야겠다고 생각했는데, netlify 배포 후 폰에서 확인했을 때는 동작이 너무 느렸다. 개선할 부분이 많을

2021년 8월 18일
·
0개의 댓글
post-thumbnail

[ TIL 13 ] - 헷갈리는 마크업 정리

드림코딩 by 엘리님 유튜브 강의를 보고, 다시 찾아보지 않기 위해 정리했다.

2021년 8월 14일
·
0개의 댓글
post-thumbnail

포포를 찾아라 미니 게임 만들기(2)

1. 코드 수정 1. 동적으로 생성되는 아이콘 HTML 파일에서 생성하던 고래 아이콘을, JS 파일에서 생성하도록 바꿨다. HTML 코드가 깔끔해졌고, 아이콘이 동적으로 생성될 수 있게 됨. 2. splash screen splash screen 을 생성했다. '니모

2021년 8월 8일
·
0개의 댓글
post-thumbnail

포포를 찾아라 미니 게임 만들기(1)

엘리님 당근게임 강의를 듣고, 다른 게임 만들기를 시도했다. 이모티콘 파일 30개로 월리를 찾아라! 같은 게임을 만들고 싶다는 생각을 했고, 실행에 옮겼다.

2021년 8월 6일
·
0개의 댓글
post-thumbnail

filter 함수로 minishop 구현하기 (2)

1. 코드 수정 1. 이벤트 위임을 사용하여 수정 2. 중복을 없애기 위해 변수 생성, 버튼이 아닌 빈 곳을 눌렀을 때 취해야 할 조건 추가, onClick 함수 따로 생성 2. 학습 내용 (1) 이벤트 위임 부모 컨테이너는 자식 요소에서 이벤트가 발생하면 모두

2021년 8월 2일
·
0개의 댓글
post-thumbnail

filter 함수로 minishop 구현하기 (1)

0. 동기 유튜브 드림코딩 by 엘리 채널에 minishop 프로젝트에 PWA 를 사용하는 예시가 올라왔다. minishop 프로젝트는 js 입문용으로 예전부터 소개되고 있었는데, 단순 웹 구현에서 더 나아가 PWA 적용도 배울 수 있는 기회였다. 엘리님 JS 기초를

2021년 8월 1일
·
0개의 댓글
post-thumbnail

[ TIL 12 ] - JS 기초 문법 정리

https://youtu.be/_DLhUBWsRtw 드림코딩 by 엘리 유튜브 참고 1. 자료형 (1) var 를 쓰면 안되는 이유 var 는 hoisting 이 적용되므로, 선언도 전에 호출되거나 값이 할당돼도 에러가 나지 않는다. let 이 있으므로 굳이 위험부담

2021년 7월 30일
·
0개의 댓글
post-thumbnail

[ TIL 11 ] - 세션

세션(session) 세션 : 서버 측에서 클라이언트를 구분하기 위해 제공하며, backend(서버의 메모리)와 쿠키(클라이언트)에 모두 저장됨. 브라우저가 backend를 방문할 때 만들어짐. 쿠키 : 클라이언트 측에서 세션ID를 저장하고 전달하는 수단 클라이언트가

2021년 7월 29일
·
0개의 댓글
post-thumbnail

[ TIL 10 ] - MongoDB / mongoose

MongoDB https://docs.mongodb.com/manual/administration/install-community (사이트에서 community edition 설치하면 됨) MongoDB는 NoSQL이며, 데이터가 JSON 형태로 db에 저장됨. 초보자

2021년 7월 27일
·
0개의 댓글
post-thumbnail

[ TIL 09 ] - 비동기 처리 (callback/ promise/ async/ await)

드림코딩 by 엘리님 강의를 참고한 내용입니다. https://youtu.be/JB_yU6Oe2eE 동기 / 비동기 js는 hoisting 이후 순서에 따라 동기적으로 실행되는 언어이다. (hoisting: var 변수, 함수 선언 등이 자동으로 가장 위로 올라가는

2021년 7월 26일
·
0개의 댓글
post-thumbnail

[ TIL 08 ]

코딩 tip 에러 먼저 출력 예외 경우, 에러 등을 먼저 처리 할 경우, 아래 코드는 에러를 신경 쓸 필요가 없어진다. import 하기 전에 export 먼저 해라. GET/ POST method 차이 GET : database 로부터 정보를 받아낼 때 사용 POS

2021년 7월 25일
·
0개의 댓글
post-thumbnail

프론트엔드 개발 참고 사이트

계속 추가할 예정입니다:)

2021년 7월 24일
·
0개의 댓글
post-thumbnail

[ TIL 07 ] - Node.js 설치 및 시작

node.js 설치 node.js node.js 를 이용하면 단 두 개의 파일만으로 서버 생성이 가능하다(package.json, 파일명.js) node.js 를 설치하면 npm 이 자동으로 설치된다. package.json package.json 파일의 "scrip

2021년 7월 18일
·
0개의 댓글
post-thumbnail

[ TIL 06 ] - pug의 사용

pug란? view template engine pug 사용법 >1. pug 설치 npm i pug >2. express에서 pug를 view engine으로 설정 app.set("view engine", "pug"); >3. pug 파일 생성 >- views 폴더를

2021년 7월 14일
·
0개의 댓글
post-thumbnail

[ TIL 05 ] express 로 서버 생성

Node.js 자바스크립트 런타임 환경. npm(Node.js Package Manager) 사용 가능한 패키지들을 검색하여 설치 및 버전 관리가 가능한 프로그램. nodemon npm 통해 설치 가능, 파일 변경 사항 감지 후 자동으로 서버를 재시작해주는 모듈. no

2021년 7월 10일
·
0개의 댓글
post-thumbnail

[ TIL 04 ] javascript 기본 메소드

push, pop, unshift, shift push, pop 에 비해 unshift, shift 의 처리 속도가 더 느리다. splice, slice splice는 배열 자체를 바꾼다. slice 는 배열 자체를 그대로 두고, 원하는 부분만 반환한다. slice

2021년 7월 9일
·
0개의 댓글
post-thumbnail

[ TIL 03 ] CS50 강의 노트(3)

부스트코스 강의를 듣고 작성한 내용입니다. 검색(탐색) 알고리즘 >1. 선형 검색(탐색) 배열의 인덱스를 처음부터 끝까지 하나씩 증가시키면서 방문하여, 그 값이 속하는지를 검사 자료가 정렬되어 있지 않거나, 그 어떤 정보도 없이 하나씩 찾아야 하는 경

2021년 7월 8일
·
0개의 댓글
post-thumbnail

[ TIL 02 ] CS50 강의 노트(2)

부스트코스 강의를 듣고 작성한 내용입니다. 컴파일링 소스 코드: 우리가 직접 작성한 코드 머신 코드: 2진수로 작성된, 컴퓨터가 이해할 수 있는 코드 소스 코드를 머신 코드로 변환하는 작업을 컴파일러라는 프로그램이 수행해준다. C언어에서는 make 툴을 이용하면 소

2021년 7월 8일
·
0개의 댓글