Code Playground

< h1 > Code Playground </ h1 >

정말 오랜만에 블로그 글을 작성하는 것 같다. 바닐라코딩에서 서버쪽 공부를 시작하면서 할 것도 엄청 많고 과제에 허덕이다보니 도저히 블로그 글을 쓸 여유가 안생겼었다. 이번에 웹소켓을 이용해서 랜덤 채팅을 구현했는데 처음에 이런 저런 버그들로 엄청 고생했어서 만들고 나니까 너무 뿌듯하다ㅜㅜ 실시간으로 소통하는 채팅을 만들기 위해 웹 소켓(WebSocket)을 사용하여 구현하였다. MDN 문서를 보면 웹 소켓은 클라이언트(브라우저)와 서버 사이에서 상호 작용 가능한 통신 세션을 설정할 수 있게 하는 기술이라고 되어있다. 그래서 개발자는 웹 소켓 API를 통해 서버로 메시지를 보내고 서버의 응답을 위해 서버를 폴링하지 않고도 이벤트 중심 응답을 받는 것이 가능하다고 되어있다. 여기서 폴링(Poling)이란 ..

지난 번에 Express와 MongoDB로 간단하게 백엔드 서버를 만들었으니 이제 그걸 이용해서 프론트엔드 구현을 마저 해보려고 한다. client/src/index.js import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './components/App'; import * as serviceWorker from './serviceWorker'; import { BrowserRouter as Router } from 'react-router-dom'; import { CookiesProvider } from 'react-cookie'; ReactDOM.render( , docume..

https://im-developer.tistory.com/164 [Node.js] Express를 backend로 하는 Create-react-app 시작하기 이번주부터 바닐라코딩에서 백엔드 공부를 시작했다. Node.js와 MongoDB를 이용하여 여러 가지 과제를 해보는 중인데 처음 접하는거라 어렵긴하지만 프론트에서 api 요청을 보내서 데이터 받아오는 것만 해보다가.. im-developer.tistory.com 지난번에 포스팅으로 올렸던 Express와 React 연습 앱을 활용해서 회원가입 / 로그인 구현을 해보기로 했다. 여러가지 방법들이 있겠지만 나는 지난번 바닐라코딩 서버 관련 과제를 하다가 만난 jwt 토큰을 이용해보기로 했다. (Json Web Token이 무엇인지 자세히 알고 싶다면..

이번주부터 바닐라코딩에서 백엔드 공부를 시작했다. Node.js와 MongoDB를 이용하여 여러 가지 과제를 해보는 중인데 처음 접하는거라 어렵긴하지만 프론트에서 api 요청을 보내서 데이터 받아오는 것만 해보다가 직접 백엔드에서 DB에 데이터를 집어넣고 가져오는 작업들을 해보니까 너무 신기하다. 오늘은 Node.js 사용자들이 많이 사용하는 프레임워크인 Express로 백엔드를 구성하고 Create-react-app으로 프론트단을 구성하는 아주 간단한 방법에 대해 포스팅해보려고 한다. 이 포스팅은 아래 블로그 글을 참고하여 작성했다. https://daveceddia.com/create-react-app-express-backend/ Create React App with an Express Backe..

좁은 서울 땅 덩어리에 미국처럼 단독주택만 짓는다면 어떨지 상상해보자. 집 짓는 데 시간도 오래 걸리고 효율도 매우 떨어질 것이다. 그런데 여러 명을 한 번에 수용할 수 있는 아파트를 지어서 방 한 칸에 1가구 씩 배정한다면 훨씬 효과적으로 주택 공급을 할 수 있을 것이다. 만약에 배열이 없었다면 어떤 데이터 100개를 처리할 때 100개의 변수를 만들고, 그 변수에 100개의 데이터를 각각 할당하여 처리를 해야만 했을 것이다. 얘기만 들어도 비효율적이고 끔찍하다. 그래서 우리는 배열이란 걸 만들어냈는데, 일종의 아파트를 만든 것이다. 그리고 아파트 칸마다 순차적으로 방번호를 부여하고 하나의 데이터를 부여한 것이다. 그리고 우리는 반복문을 사용하여 각각의 방에 든 데이터를 가지고 같은 작업을 여러 번 반..

1. 산술연산자 / 증감연산자 #include int main() { int num5 = 3, num6 = 3, num7 = 3, num8 = 3; num5++; // ++num5; num5=num5+1; num5+=1; printf("num5= %d \n", num5); ++num6; // num6++; num6=num6+1; num6+=1; printf("num6= %d \n", num6); num7--; // --num7; num7=num7-1; num7-=1; printf("num7= %d \n", num7); --num8; // num8--; num8=num8-1; num8-=1; printf("num8= %d \n", num8); system("pause"); return 0; } 자바스크립트..

정보처리기사 실기반 수강을 시작하면서 C언어 기초를 배우게 되었다. 아마 컴퓨터공학 관련 학과를 나왔다면 아마 필수적으로 공부했을 과목인데, 나는 비전공이라서 이번 기회에 처음 접하게 되었다. 내가 지금 공부하고 있는 자바스크립트와 가장 크게 다른 점은 자바스크립트는 인터프리터 언어이고 C언어는 컴파일러 언어라는 점이다. 이 부분에 대해서는 아래 글에 좀 더 자세하게 설명되어 있다. https://im-developer.tistory.com/77 [JS/호이스팅] Interpreted Language인 자바스크립트의 호이스팅(Hoisting)에 대하여 자바스크립트, 인터프리터 언어(Interpreted Language) 보통 우리가 사용하는 프로그래밍 언어는 고급 언어(High Level Language..