API 통신이 안된다.. 왜? 로컬에서는 잘 되는데 서버에서는 통신이 안되는 이유는 뭘까... 먼저 오류에 대해 알아보자 오류 내용 Access to XMLHttpRequest at 'https://cedarsojt.store:4000/signup/list/country/branch' from origin 'https://cedarsojt.store' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 오류 내용을 해석해보면 XMLHttpRequest 요청이 CORS(Cross-Origin Resource Sharin..
📋 Micro Frontend Micro Frontend 란 백엔드에서 사용하고 있는 마이크로 서비스 아키텍쳐처럼 프론트엔드에서 관리하는 서비스를 분리해서 개발, 관리하는 패턴을 말합니다. Micro Service 처럼 전체 화면을 작동할 수 있는 단위로 나누어 개발한 후 서로 조립하는 방식입니다. 📝 Micro Frontend 장점 작고, 응집력 있고 유지보수에 용이한 코드베이스를 가질 수 있습니다. 각 Micro Frontend는 고유한 기술 및 프레임 워크를 선택할 수 있습니다. 프론트엔드 개발을 점진적 업그레이드 또는 재작성이 수월해집니다. 분리 배포가 용이하고, 자율적인 팀 조직운영이 수월해집니다. 📝 Micro Frontend 단점 배포 번들 사이즈가 커질 수 있습니다. 서로 간의 개발 환경의..
📋 Web Server 란? 웹 서버랑 HTTP 프로토콜을 기반으로 클라이언트가 웹 브라우저에서 어떠한 요청을 하면 그 요청을 받아 정적 컨텐츠를 제공하는 서버입니다. 정적 컨텐츠란 단순 html, css, image, file 등 즉시 응답 가능한 컨텐츠 입니다. 이때 웹 서버가 정적 컨텐츠가 아닌 종적 컨텐츠를 요청받으면 WAS에게 해당 요청을 넘겨주고, WAS에서 처리한 결과를 클라이언트에게 전달하는 역할도 해줍니다. 📋 WAS(Web Application Server) 란? WAS란 DB 조회 혹은 다양한 로직 처리를 요구하는 동적 컨텐츠를 제공하기 위해 만들어진 Application 서버입니다. HTTP 프로토콜을 기반으로 사용자 컴퓨터나 장치에 어플리케이션을 수행해주는 미들웨어로서, 주로 데이..
📝 SPA(Single Page Application) SPA란 하나의 페이지로 이루어진 애플리케이션이라는 의미입니다. 왜 싱글 페이지 애플리케이션이라는 개념이 생기기 전에 사용되던 멀티 페이지 애플리케이션을 먼저 알아보도록 하겠습니다. 멀티 페이지 애플리케이션에서는 사용자가 다른 페이지로 이동할 때마다 새로운 html을 받아오고, 페이지를 로딩할 때마다 서버에서 CSS, JS, image 파일 등의 리소스를 전달받아 브라우저 화면에 보여 주었습니다. 각 페이지마다 다른 html 파일을 만들어서 제공을 하거나, 데이터에 따라 유동적인 html을 생성해 주는 템플릿 엔진을 사용하기도 했습니다. 사용자 인터랙션이 별로 없는 정적인 페이지들은 기존의 방식이 적합하지만, 사용자 인터랙션이 많고 다양한 정보를 제..
📋 크로스 브라우징(cross browsing) 이란? 웹페이지 제작 시에 모든 브라우저에서 깨지지 않고 의도한 대로 올바르게(호환성) 나오게 하는 작업을 말합니다. ✔ 크로스 브라우징을 하는 이유 크롬, 익스플로러, 파이어폭스, 웨일, 사파리 등 여러가지 브라우저들이 존재하는데 이 브라우저 들은 각각의 랜더링 엔진이 다르기 때문에 크로스 브라우징이 필요합니다. ✔ 브라우저 종류와 점유율 브라우저에 대응할 때 가장 점유율이 높은 브라우저부터 맞추는 것이 좋습니다. 1위는 크롬, 2위는 사파리, 3위는 파이어폭스 등이 있습니다. 점유율 사이트 : https://gs.statcounter.com/
