본문 바로가기

전체 글

 (401)
왜 빌드된 결과물을 깃에 올리면 안되나? 이 질문을 해결하기 위해 단톡방에 물었다. 답은 여럿이었고 공통된 답으로 받은 내용은 이 통째로 보관된 결과물을 Git에 올리게 된다면 변경사항을 업로드하거나 내려받을 때 시간이 오래 걸릴거고, 작업 폴더 안 .git 폴더의 용량도 크게 늘게 될 것이라는 것이다. 다른 이유로는 보안상의 이유, 난독화된 것을 무엇하러 올리나? 등이 있다. 무엇보다 GPT에게 물어보니 정확한 답변을 얻을 수 있었다. 누군가가 GitHub에 빌드된 파일을 업로드하지 않기로 결정하는 데에는 여러 가지 이유가 있을 수 있습니다. 파일 크기: 빌드된 파일은 소스 코드 자체보다 클 수 있으며, 특히 컴파일된 언어나 이미지 및 비디오와 같은 자산이 포함된 프로젝트에서는 더욱 그렇습니다. GitHub에 대용량 파일을 업로드하면 많은 저..
Web Server와 WAS의 차이와 웹 서비스 구조 출처: https://gmlwjd9405.github.io/2018/10/27/webserver-vs-was.htmlFront, Back 분리시 동작 원리https://flexyduck.tistory.com/363  Front, Back분리시 동작 원리에 대해 설명한 글(매우유용)목표!!        Static Pages와 Dynamic Pages 과정을 이해한다.        Web Server와 WAS의 차이를 이해한다.        Web 서비스 구조(Web Service Architecture)에 대해 이해한다.1.    Static Pages        Web Server는 파일 경로 이름을 받아 경로와 일치하는 file contents를 반환한다.        항상 동일한 페이지를 반환한다..
expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. 리엑트 사용중 위와 같은 에러 메시지가 떳다. 원인중 하나 일수 있는게 import한 문서에서 어떠한 라이브러리가 필요한데 그 라이브러리가 없을때 이러한 에러가 떳다. 나같은 경우 그 라이브러리는 내가 만든 것이었다.
Socket.io 에 대하여 #socket.io-client 출처: https://inpa.tistory.com/entry/SOCKET-%F0%9F%93%9A-SocketIO-%EC%82%AC%EC%9A%A9-%ED%95%B4%EB%B3%B4%EA%B8%B0 ( ****정말 잘쓴 블로그****) https://smaivnn.tistory.com/2#article-1--socket-io-%EC%9D%B4%EB%9E%80? https://velog.io/@fejigu/Socket.IO-client 1. Socket.io 이란? socket.io를 알아보기 전, 웹 소켓에 대해 먼저 알아보자. 웹 소켓은 HTML5에 새로 추가된 실시간 양 방향 데이터 전송을 위한 기술이다. http가 아닌 ws프로토콜을 사용하며, 따라서 브라우저, 서버..
왜 axios, SWR와 같은 라이브러리를 사용하면서 별도로 Socket을 사용해야 하나? 출처: GPT, https://velog.io/@somday/RESTful-API-%EC%9D%B4%EB%9E%80 (rest api에 대하여) 요약: 실시간 통신과 같은 상호 작용 유형이 아닌 자원을 제어해야만 하는 상호 작용 유형(RESTful API)을 위해 Socket.io가 아닌 axios를 별도로 사용해 주어야 하는 것이다. 소켓과 Axios의 차이점: 웹소켓은 TCP연결을 통해 실시간 완벽한 양방향 통신 채널을 제공한다(기존의 HTTP에 양방향 통신을 가능하게 한 것이 웹소켓이다). Axios는 브라우저와 Node.js를 위한 약속 기반 HTTP클라이언트이다. 소켓같은 경우 실시간 양방향 통신(real time full duplex communication)을 허용하여 어떤 반응을 기대하지 ..
웹 소켓에 대하여(ing) 참고: https://www.youtube.com/watch?v=MPQHvwPxDUw 웹 소켓이란? 두 프로그램 간의 메시지를 교환하기 위한 통신 방법 중 하나이다. 또한 표준 프로토콜 중 하나임.
Script태그에 대하여 참고: https://shape-coding.tistory.com/entry/JavaScript-Script-%ED%83%9C%EA%B7%B8%EC%9D%98-%EC%9C%84%EC%B9%98%EB%8A%94-%EC%96%B4%EB%94%94%EA%B0%80-%EC%A2%8B%EC%9D%84%EA%B9%8C (script태그는 어디에 위치해야 좋은가를 말하는글) HTML 문서를 읽고 파싱하는 과정에서 defer도 async와 비슷합니다. 태그를 만나도 HTML 파싱이 중단되지 않고 javaScript 파일과 함께 파싱됩니다. 하지만 다른 점은 javaScript 코드를 실행하는 시점은 HTML 파싱이 모두 완료된 이후입니다. 이처럼 , , 태그를 상황에 맞게 사용하여 스크립트 파일의 파싱 순서를 제어할 ..
React 프로젝트중 발생한 Network에러 cors에러라고 뜨지 않아도 단순히 network 오류여도 cors에러일수 있다. 정말 이렇게 어떠한 에러에서 뱉어내는 에러 메시지에 생뚱 맞은 해결책이 연결되어 있다... 방법은 없다. 구글링을 하는 것밖에. 오류메시지를 그대로 적고 그 오류에 어떠한 해결책이 있는가를 검색하는 방법뿐이 없다. (오류 메시지에는 cors에 관한 언급이 전혀 없었다. 하지만 나는 그 오류가 무엇 때문에 생긴것인지 모르므로 모든 가능성을 열어두어야 하고 모든 가능성을 열어두면 오류 해결에 많은 시간이 걸리니 구글링이 답이라는 것이다) 해결책: cors관련 라이브러리를 서버에 설치해 주었다. https://www.npmjs.com/package/cors

티스토리툴바