기록하는 개발자

https://www.acmicpc.net/problem/1913 1913번: 달팽이 N개의 줄에 걸쳐 표를 출력한다. 각 줄에 N개의 자연수를 한 칸씩 띄어서 출력하면 되며, 자릿수를 맞출 필요가 없다. N+1번째 줄에는 입력받은 자연수의 좌표를 나타내는 두 정수를 한 칸 띄어서 www.acmicpc.net 구현 부분 코드 int[][] arr = new int[n][n]; int value =1,move =1; int x = n/2, y=n/2; while(true) { for(int i=0; i

Next.js 는 프론트엔드에 관심이 있는 사람이라면 한 번쯤은 들어봤을 것이다. Next.js에 대해 이해하기 위해서는 SSR, CSR, SSG 등에 대한 지식이 필요한데, 이전에 정리해둔 글을 참고하면 좋을 것 같다. https://mingmeng030.tistory.com/249 SSR과 CSR, MPA와 SPA react로 개발을 하면서 spa는 많이 들어봤지만 single page application이라는 것만 알았지 정확히 무엇이고, 왜 사용해야하는지, 장단점은 무엇인지 등에 대해 모르고 있었다. 블로그 정리를 위해 서치 mingmeng030.tistory.com https://mingmeng030.tistory.com/250 SSG(Static Site Generator)란? https:/..

react로 개발을 해본 사람이라면 babel과 webpack에 대해 들어본 적 있을 것이다. 그렇다면 이 babel과 webpack 두 녀석은 정확히 무슨일을 하는걸까? webpack Webpack은 여러개 파일을 하나로 합쳐주는 모듈 번들러이다. Webpack은 '빌드'라는 과정을 통해 프로젝트에서 코드가 수정될 때마다 자동으로 트랜스파일러를 동작시켜준다. 자바스크립트 코드 뿐 아니라 이미지, CSS등도 같이 빌드한다. 번들러를 사용하면 여러개 파일을 하나로 묶어주기 때문에 네트워크 접속의 부담을 줄여 더 빠른 서비스를 제공할 수 있다. Babel 바벨은 코드를 재작성해주는 대표적인 트랜스파일러(transpiler) 프로그램으로, 모든 브라우저가 최신 기능인 ES6의 기능을 제공하지 않기 때문에 ES..

javascript의 비동기 처리 세번 째, async/await 에 대한 글이다. 첫 번째 Callback과 Promise에 대한 정리는 아래 링크에서 볼 수 있다. https://mingmeng030.tistory.com/257 [Javascript] 비동기처리 - 1. Callback javascript의 비동기 처리 방법에 대하여 callback , promise , async/await 세 파트로 나누어 정리를 해보려 한다. 그 중 첫 번째 Callback에 대한 글이다. Callback 아래 함수는 일반적으로 parameter를 받아 만든 mingmeng030.tistory.com https://mingmeng030.tistory.com/258 [Javascript] 비동기처리 - 2. Pro..

javascript의 비동기 처리 두번 째, Promise에 대한 글이다. 첫 번째 Callback에 대한 정리는 아래 링크에서 볼 수 있다. https://mingmeng030.tistory.com/257 [Javascript] 비동기처리 - 1. Callback javascript의 비동기 처리 방법에 대하여 callback , promise , async/await 세 파트로 나누어 정리를 해보려 한다. 그 중 첫 번째 Callback에 대한 글이다. Callback 아래 함수는 일반적으로 parameter를 받아 만든 mingmeng030.tistory.com 위 포스팅에서 Callback 의 문제점으로 '콜백 지옥'을 얘기하면서 이의 해결책으로 promise 또는 async/await를 사용한다..

javascript의 비동기 처리 방법에 대하여 callback , promise , async/await 세 파트로 나누어 정리를 해보려 한다. 그 중 첫 번째 Callback에 대한 글이다. Callback 아래 함수는 일반적으로 parameter를 받아 만든 객체를 return한다. userInfo라는 변수에 함수 getUserInfo 의 return 값을 저장하여 console에 print 한다. 아래는 위 함수에 callback 함수를 적용하여 동일한 결과가 나오도록 수정한 코드이다. getUserInfoCallBack 함수는 두 번째 인자로 cb라는 callback 함수를 받는다. 9번째 줄에서 getUserInfoCallBack 함수를 호출하면서 익명함수를 callback 함수로 넣어주었고,..

이 글은 아래 포스트와 이어집니다 : ) https://mingmeng030.tistory.com/255 [vanillaJs] mongoDB, node.js, fetch api로 crud page 만들기-1. backend 구성 mongoDB와 node.js, 그리고 javascript의 fetch api를 사용하여 crud가 가능한 페이지를 만들어 보았다. react가 역시 편하다는 것을 또 깨닫는 과정이었다.. mongoDB를 사용하고 nodejs로 restful API를 만들어 본 것 mingmeng030.tistory.com 완성 화면 index.html Add new Post Title Content Add Post main.js const postsList = document.querySele..

mongoDB와 node.js, 그리고 javascript의 fetch api를 사용하여 crud가 가능한 페이지를 만들어 보았다. react가 역시 편하다는 것을 또 깨닫는 과정이었다.. mongoDB를 사용하고 nodejs로 restful API를 만들어 본 것도 새로운 경험이라 재미있었다. 완성 화면 db에 저장된 데이터 '_id'와 '__v' 는 데이터를 저장할 때 사용하는 save() 함수가 실행될 때 자동으로 생성된다. (__v는 문서의 내부 개정판을 설명하는 버전키, default value=0 ) server.js const express = require("express"); const mongoose = require("mongoose"); const { MONGO_URI } = req..