맨땅에 코딩 맨땅에 코딩

백엔드 개발을 진행하며 SSR은 서버에서 동적으로 html을 생성하여 response해주고 클라이언트 페이지에 렌더링 하는 방식이고, CSR은 초기에 서버로부터 정적인파일 (HTML, CSS, JavaScript) 등을 받고 필요한 부분을 받아와 업데이트 시켜주는 방식으로 이해하고 있었는데 실무에 적용해서 개발을 진행하다 보니 헷갈려서 이곳에 정리해보려고 한다. 먼저, SSR(Server-Side Rendering)은 서버에서 전체 HTML을 생성하여 클라이언트에게 전달하고, 클라이언트는 해당 HTML을 화면에 렌더링하는 방식이다. 나는 여기서 '전체'라는 단어에 초점을 맞춰서 이해했다. 완성된 전체의 웹페이지를 서버에서 받아온다는 점에서 검색엔진 최적화(SEO)에 유리하고, 빠른 페이지 렌더링, OG(..

vi ~/.vimrc 를 눌러서 vimrc를 확인해 보면 이런식으로 세팅이 되어있다. 여기서 set foldmethod=indent로 세팅을 해주면 세팅이 완료된다. 위 코드를 예시로 두번째 라인에서 za를 눌러주면 이처럼 들여쓰기를 기준으로 한번에 코드가 접히는 걸 확인할 수 있다. 세번째 라인에서 za를 눌러주면 위처럼 들여쓰기가 된 부분을 기준으로 새롭게 코드가 접히는 걸 확인할 수 있다. 이처럼 들여쓰기를 기준으로 za를 누르면 코드를 접을 수 있다. z + (shift) + r 을 눌러주면 접혔던 코드가 전부 펴진다. 지금까지 vi 에디터에서 za zr을 이용하여 손 쉽게 코드를 접었다 펼치는 기능에 대해서 작성해 보았다. 이 기능은 vi에디터로 작업을 할때 아주 많이 사용하기도 하고, 애용하는..

input tag에서 이미지 파일을 받아서 웹서버로 넘겨주는 기능을 필요로 할 때, nodejs의 multer 를 이용해서 가져올 수 있다. 위 html 코드를 예시로 작성해 보았을 때, $(function(){ $("#submit_btn").on("click", function(){ let formData = new FormData(); formData.append('img', $("#multipart_file").prop('files')[0]); }); }); 위 코드에서 formData객체를 새로 생성 후, formData객체에 데이터를 추가하는 이벤트 리스너를 등록한 후에 $.ajax({ url: 서버URL, type: "POST", data: Formdata, contentType: false,..