본문 바로가기

전체 글36

[Next.js] Next.js 14 기초 기본 용어 메타데이터(metadata) Next.js는 메타데이터(metadata)로 HTML에서 사용하던 `head` 엘리먼트를 대신합니다. Next.js에서 폴더와 파일의 역할 폴더는 경로를 정의하는 데 사용됩니다. 경로는 루트 폴더(root folder)부터, `page.js` 파일이 포함된 최종 리프 폴더(leaf folder)까지 파일 시스템 계층 구조를 따라가는 중첩된 폴더(nested folder)의 단일 경로입니다. 파일은 경로 세그먼트에 표시되는 UI를 만드는 데 사용됩니다. Next.js에서 서버 컴포넌트를 먼저 렌더링(pre rendering)하여 HTML로 클라이언트에 전송합니다. SPA를 하기 위해 필요한 코드는 따로 js파일을 생성하여 브라우저에 전송합니다.(ex. Link 컴포.. 2024. 1. 4.
[정보처리기사] 1.소프트웨어 설계 - 화면 설계 (UI 설계) 용어 정리 스토리보드 정의 1. 스토리의 내용을 쉽게 이해할 수 있도록 주요 장면을 그림으로 정리한 계획표 2. 시나리오의 내용을 시각화하여 표현하기 위한 도구인 동시에, 제작진 사이의 의사소통을 돕기 위한 수단 3. 스토리보드에는 주제와 화면 제목, 화면의 구성, 화면 설명, 연결화면 등을 기록한다. 4. 스토리보드는 그 형식과 용도에 따라 다양한 형식으로 작성할 수 있다. 감성공학 인체의 특징과 감성을 제품설계에 최대한 반영하는 기술로, '인간이 가지고 있는 소망으로서의 이미지나 감성을 구체적인 제품설계로 실현해내는 공학적인 접근방법' 이라고 정의할 수 있다. 감성공학 분야 자동차, 가전, 정보통신기기, 가구 분야 UI 화면 설계 도구 이름 설명 스토리보드 (Storyboard) 정책, 프로세스, 와.. 2023. 12. 10.
[JavaScript] 클래스(Class) 정의 클래스는 객체지향 프로그래밍에서 특정 객체인 인스턴스를 생성하기 위해 변수(=프로퍼티)와 메서드를 정의하는 일종의 틀이라고 할 수 있습니다. 실제 데이터를 구현한 것을 객체라고 하고, 데이터를 구현하는 데 일반화된 정보들을 정리해 둔 것을 클래스라고 부릅니다. 이렇게 구성된 클래스를 객체로 만드는 과정을 인스턴스화(instantiating) 라고 합니다. ES6 이전의 자바스크립트에서는 객체지향 프로그래밍을 수행하기 위해 함수의 프로토타입을 사용하였습니다. 그러나 자바스크립트는 ES6부터 도입된 `class` 키워드를 사용하여 (완전히 동일하지는 않지만) C++, JAVA와 같은 전통적인 객체지향 프로그래밍 언어처럼 객체를 정의할 수 있게 되었습니다. 그러나 재미있는 점은 자바스크립트에서 class.. 2023. 12. 4.
[정보처리기사] 1.소프트웨어 설계 - 화면 설계(UI 요구사항 확인) 용어 정리 소프트웨어 아키텍쳐 특징 1. 소프트웨어의 사전 작업을 통해 소프트웨어 개발을 쉽게 하도록 기본 틀을 만드는 것 2. 소프트웨어 개발의 중심축 3. 다양한 수준에서 구성 요소의 역할과 구성 요소 간의 관계에 집중 4. 모든 단계에 영향을 줄만한 초기 의사 결정의 핵심 5. 일반적인 모양과 조화를 위한 스타일을 정하는 작업 아키텍쳐 패턴 정의 1. 소프트웨어 아키텍쳐에서 일반적으로 발생하는 문제점들에 대한 일반화되고 재사용 가능한 솔루션 2. 아키텍쳐 패턴은 소프트웨어 디자인 패턴과 비슷하지만 더 넒은 범위에 속함 3. 컴퓨터 하드웨어 성능 제한, 비즈니스 위험의 최소화, 고가용성 등 소프트웨어 공학의 다양한 문제를 해결 UI (User Interface) 사용자가 시스템을 원활히 사용하도록 돕.. 2023. 12. 3.