본문 바로가기

25

[웹 지식] 렌더링 - CSR과 SSR (w/TTV, TTI) ㅁ렌더링(Rendering): 컴퓨터가 데이터를 시각적으로 변환하여 사용자에게 보여주는 과정웹 개발에서 렌더링은 주로 브라우저가 웹 페이지를 구성하는 데이터(HTML, CSS, JavaScript 등)를 받아서, 이를 사용자 화면에 표시하는 과정을 의미한다 렌더링의 종류 2가지1. 클라이언트 사이드 렌더링 (CSR, Client-Side Rendering): 클라이언트(보통 브라우저)에서 페이지를 렌더링하는 방식서버에서 HTML 파일을 기본적으로 빈 상태로 보내고, 클라이언트(브라우저)가 JavaScript를 통해 동적으로 HTML을 구성하는 방식이다. JavaScript가 실행되어 필요한 데이터를 가져오고, 브라우저에서 이를 해석하여 화면을 구성하게 된다. 작동 방식:사용자가 웹 페이지에 접속하면, 서.. 2024. 10. 2.
[웹 지식] 웹 서버와 WAS(Web Application Server) https://claremont.tistory.com/entry/%EC%A0%95%EC%A0%81-%EC%BD%98%ED%85%90%EC%B8%A0%EC%99%80-%EB%8F%99%EC%A0%81-%EC%BD%98%ED%85%90%EC%B8%A0 정적 콘텐츠와 동적 콘텐츠정적 콘텐츠와 동적 콘텐츠는 웹 애플리케이션에서 서버가 클라이언트에게 제공하는 두 가지 주요 유형의 콘텐츠이다. 이 두 가지는 처리 방식과 사용자에게 보여지는 방법에서 큰 차이가 있다claremont.tistory.com위의 내용을 먼저 숙지하고 오자!  ㅁ웹 서버: 주로 정적 콘텐츠(HTML, CSS, 이미지, JavaScript 파일 등)를 클라이언트에게 제공하는 역할클라이언트가 웹 페이지를 요청하면, 웹 서버는 미리 준비된 정적 .. 2024. 10. 1.
[웹 지식] 정적 콘텐츠와 동적 콘텐츠 정적 콘텐츠와 동적 콘텐츠는 웹 애플리케이션에서 서버가 클라이언트에게 제공하는 두 가지 주요 유형의 콘텐츠이다. 이 두 가지는 처리 방식과 사용자에게 보여지는 방법에서 큰 차이가 있다. 정적 웹은 페이지가 만들어진 최종본을 보여주고 동적 웹은 수시로 바뀌는 데이터를 DB로부터 받아서 그때그때 다른 화면을 보여준다. 보여주어야할 데이터가 자주 바뀌지 않는 성질을 가진다면 정적 웹을 구축하고 보여주어야 할 데이터가 상시로 바뀌는 성질을 가진다면 동적 웹을 구축하면 된다. 정적 콘텐츠 (Static Content)정의: 미리 서버에 저장된 콘텐츠로, 모든 사용자에게 동일한 형식과 내용으로 전달되는 콘텐츠특징:서버 처리 없이 직접 전달: 서버에서 미리 준비된 파일을 클라이언트에게 그대로 전달한다. 추가적인 연산.. 2024. 10. 1.
[웹 지식] 유지보수 vs 최적화 유지보수 vs 최적화를 고려해야 하는 상황이라면 유지보수하기 좋은 코드를 먼저 고민해야 한다. 특히 최신 컴퓨터는 매우 빠르기 때문에 메모리 상에서 발생하는 연산을 몇 번 줄인다고 해도 실질적인 도움이 되지 않는 경우가 많다. 코드 변경 없이 성능 최적화를 하면 가장 좋겠지만, 성능 최적화는 대부분 단순함보다는 복잡함을 요구하고, 더 많은 코드들을 추가로 만들어야 한다. 최적화를 위해 유지보수 해야 하는 코드가 더 늘어나는 것이다. 그런데 진짜 문제는 최적화를 한다고 했지만 전체 애플리케이션의 성능 관점에서 보면 불필요한 최적화를 할 가능성이 있다. 특히 웹 애플리케이션의 경우 메모리 안에서 발생하는 연산 하나보다 네트워크 호출 한 번이 많게는 수십만배 더 오래 걸린다. 자바 메모리 내부에서 발생하는 연.. 2024. 8. 22.
[웹 지식] 사이드 이펙트(side effect) 사이드 이펙트(side effect)는 프로그래밍에서 어떤 계산이 주된 작업 외에 추가적인 부수 효과를 일으키는 것을 말한 다. 쉽게 말하면 '의도하지 않은 결과'를 의미하며 프로그래밍에서 사이드 이펙트는 보통 부정적인 의미로 사용한다. 1. 사이드 이펙트의 예시전역 변수 수정: 함수가 전역 변수를 수정하는 경우.입력 값 수정: 함수가 전달된 인자의 값을 직접 변경하는 경우.파일 시스템에 쓰기: 함수가 파일에 데이터를 쓰거나 파일을 수정하는 경우.데이터베이스 업데이트: 함수가 데이터베이스에 값을 삽입하거나 갱신하는 경우.콘솔 출력: 함수가 콘솔에 메시지를 출력하는 경우. (System.out.println() 등)네트워크 요청: 함수가 외부 네트워크 요청을 하는 경우. 2. 사이드 이펙트의 문제점"사이드.. 2024. 8. 20.
[웹 지식] 도커(docker)란? 도커(docker): LXC(리눅스 컨테이너스)라는 커널 컨테이너 기술을 이용하여 만든 컨테이너 기술 중 하나Go언어로 개발된 오픈소스 프로젝트이며(아파치 라이선스 2.0) 사실상 업계 표준이 되어가고 있는 중이다 Docker는 애플리케이션을 신속하게 구축, 테스트 및 배포할 수 있게 해 준다. Docker는 소프트웨어를 컨테이너라는 표준화된 유닛으로 패키징하며, 이 컨테이너에는 라이브러리, 시스템 도구, 코드, 런타임 등 소프트웨어를 실행하는 데 필요한 모든 것이 포함되어 있다. Docker를 사용하면 환경에 구애받지 않고 애플리케이션을 신속하게 배포 및 확장할 수 있으며 컨테이너를 매우 가벼운 모듈식 가상 머신처럼 다룰 수 있게 된다.       출처 및 참고: 도커 공식 홈페이지 https://ww.. 2024. 6. 25.
[웹 지식] 웹 서비스 개발의 이해 [HTML5가 지원하는 주요 기능]- 멀티미디어 기능 제공 - 플러그인 없이 음악, 동영상 재생- 그래픽 지원 - 2차원, 3차원- 서버와 클라이언트 간의 실시간 양방향 소켓 통신 지원 (e.g. 실시간 채팅, 온라인 게임)- 다양한 장치 접근 (e.g. 배터리 잔량, 현재 위치, 알람 등)- 시맨틱 태그 추가 (시맨틱 웹: 컴퓨터 프로그램이 코드를 읽고 의미를 인식할 수 있는 지능형 웹)- CSS3 스타일시트 - 3차원 변환, 애니메이션 효과 등  ㅇ메타 태그(meta tag): 웹 페이지에 대한 추가 정보를 제공 운영체제 기술블로그 추가지식1) 가상머신(Virtual Machine) 가상머신은 소프트웨어적으로 만들어낸 가상 컴퓨터이다 가상머신을 설치하면 새로운 운영.. 2024. 6. 20.