본문 바로가기

프레임워크/웹 지식21

사용자 경험(UX)에 대해서 ㅇ사용자 경험(UX, User Experience): 사용자가 웹사이트나 애플리케이션을 이용하면서 느끼는 총체적인 경험즉, 웹 애플리케이션이나 페이지를 사용하는 동안의 모든 상호작용, 감정, 만족도 등을 포괄하는 개념이다. 사용자 경험은 단순히 디자인만을 의미하는 것이 아니라, 기능성, 사용 편의성, 효율성, 감성적 만족 등 여러 요소들이 결합된 결과이다.  [사용자 경험의 주요 요소]사용성(Usability): 사용자가 웹사이트를 쉽게 이해하고, 사용할 수 있는가? 직관적이고 명확한 UI 설계와 논리적인 정보 구조가 중요하다. 예를 들어, 버튼의 위치, 폼 작성 방식 등이 여기에 해당한다.접근성(Accessibility): 다양한 사용자가 불편 없이 웹사이트에 접근할 수 있는가? 장애를 가진 사용자나,.. 2024. 10. 5.
프론트엔드 개발자가 탄생하게 된 배경 프론트엔드 개발자가 탄생하게 된 배경은 웹 기술의 발전과 함께 점점 더 복잡해지고 정교해진 사용자 경험의 요구에서 비롯되었다. 초기 웹 페이지는 정적인 텍스트와 이미지로 구성된 단순한 문서들이었지만, 웹이 발전함에 따라 더 동적이고 인터랙티브한 웹 애플리케이션이 필요해지게 되었고, 이에 따라 프론트엔드 개발의 중요성이 급부상했다. 이번 글에서는 프론트엔드 개발자가 탄생하게 된 배경과 그 진화를 살펴보자. (참고) 여기서 말하는 사용자 경험이란?https://claremont.tistory.com/entry/%EC%82%AC%EC%9A%A9%EC%9E%90-%EA%B2%BD%ED%97%98UX%EC%97%90-%EB%8C%80%ED%95%B4%EC%84%9C 사용자 경험(UX)에 대해서ㅇ사용자 경험(UX,.. 2024. 10. 4.
데이터 파싱이란?(feat. CSV, XML, JSON, YAML과 AJAX) https://claremont.tistory.com/entry/AJAX%EC%99%80-CSV-XML-JSON-YAML AJAX와 CSV, XML, JSON, YAML"데이터를 저장하고 전송하기 위한 포맷을" 알아볼 거다. 각각의 포맷은 데이터 표현 방식과 사용 목적에 따라 장단점이 있어서, 필요에 맞는 포맷을 선택하는 게 중요하다. 이번 포스팅에서는claremont.tistory.com이전의 포스팅에서는 데이터를 저장하고 전송하기 위한 포맷을 알아보았다. 각각의 포맷은 데이터 표현 방식과 사용 목적에 따라 장단점이 있어서, 필요에 맞는 포맷을 선택하는 것이 중요하다. 이번 포스팅에서는 대표적인 데이터 포맷인 CSV, XML, JSON, YAML의 데이터 파싱에 대해서 알아보고, 각 포맷의 예시를 통해.. 2024. 10. 4.
AJAX와 CSV, XML, JSON, YAML "데이터를 저장하고 전송하기 위한 포맷을" 알아볼 거다. 각각의 포맷은 데이터 표현 방식과 사용 목적에 따라 장단점이 있어서, 필요에 맞는 포맷을 선택하는 게 중요하다. 이번 포스팅에서는 대표적인 데이터 포맷인 CSV, XML, JSON, YAML 그리고 AJAX에 대해 살펴보겠다. ㅇCSV(Comma-Separated Values): 콤마 기준각 행은 레코드를 나타내며, 각 필드는 쉼표로 구분된다. 주로 스프레드시트 프로그램이나 데이터베이스 간의 데이터 이동에 사용된다.이름,나이,직업,도시홍길동,30,개발자,서울김철수,25,디자이너,부산이영희,28,마케터,대구장점단순성: 구조가 간단하여 작성과 읽기가 용이하다.호환성: 대부분의 데이터 처리 도구와 프로그램에서 지원된다.경량성: 불필요한 메타데이터가 없어.. 2024. 10. 4.
렌더링 - 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.
썸머타임과 타임존 계산 ㅇ썸머 타임(일광 절약 시간: DST, Daylight Saving Time)보통 3월에서 10월은 태양이 일찍 뜨고, 나머지는 태양이 상대적으로 늦게 뜬다. 시간도 여기에 맞추어 1시간 앞당기거나 늦추는 제도를 썸머 타임이라 한다.  ㅇ타임존 계산세계는 다양한 타임존으로 나뉘어져 있으며, 각 타임존은 UTC(협정 세계시)로부터의 시간 차이로 정의된다.UTC (Coordinated Universal Time, 협정 세계시): 원자 시계를 사용하여 측정한 국제적으로 합의된 시간 체계. 지구의 자전 속도가 변화하는 것을 고려하여 윤초를 추가하거나 빼는 방식으로 시간을 조정함으로써, 보다 정확한 시간을 유지한다. 따라서 정밀한 시간 측정과 국제적인 표준에 관해서는 UTC가 선호된다.기준 시간: UTC+0전 세.. 2024. 8. 28.
유지보수 vs 최적화 유지보수 vs 최적화를 고려해야 하는 상황이라면 유지보수하기 좋은 코드를 먼저 고민해야 한다. 특히 최신 컴퓨터는 매우 빠르기 때문에 메모리 상에서 발생하는 연산을 몇 번 줄인다고 해도 실질적인 도움이 되지 않는 경우가 많다. 코드 변경 없이 성능 최적화를 하면 가장 좋겠지만, 성능 최적화는 대부분 단순함보다는 복잡함을 요구하고, 더 많은 코드들을 추가로 만들어야 한다. 최적화를 위해 유지보수 해야 하는 코드가 더 늘어나는 것이다. 그런데 진짜 문제는 최적화를 한다고 했지만 전체 애플리케이션의 성능 관점에서 보면 불필요한 최적화를 할 가능성이 있다. 특히 웹 애플리케이션의 경우 메모리 안에서 발생하는 연산 하나보다 네트워크 호출 한 번이 많게는 수십만배 더 오래 걸린다. 자바 메모리 내부에서 발생하는 연.. 2024. 8. 22.

티스토리툴바