SKALA

Front-framework: Vue.js - Stock Market

Vue 3 Composition API와 커스텀 API 통신 모듈을 활용하여 구축한 SKALA Stock Market의 핵심 구현 내용 정리 📌 프로젝트 개요시스템 구성기술 스택Frontend: Vue 3 (Composition API), ViteUI: Bootstrap 5, Bootstrap Icons상태 관리: Reactive, Ref, SessionStorage통신: Custom API Wrapper (Axios 기반) 데이터 흐름 요약 (Data Flow)Vue.js의 반응형 시스템(Reactivity System)을 기반으로 한 전체 데이터 흐름은 다음과 같다.사용자 입력: v-model을 통해 사용자의 입력값이 ref 또는 reactive 변수에 실시간으로 반영된다.자동 감지: 변수가 변경되..

2026. 2. 9. 17:41
SKALA

Front-framework: Vue.js

1. Vue.js란?Vue.js사용자 인터페이스를 만들기 위한 프로그레시브 JavaScript 프레임워크컴포넌트 기반으로 동작하며, 반응형 데이터 바인딩과 가상 DOM을 활용하여 효율적인 렌더링을 제공 DOM(Document Object Model): HTML 문서를 JavaScript가 이해하고 조작할 수 있도록 트리 구조로 표현한 것예를 들어 이런 HTML이 있다면: 제목 내용브라우저는 이걸 트리 구조의 객체로 만듦. JavaScript로 document.getElementById('app')처럼 접근해서 내용을 바꾸거나 스타일을 변경할 수 있음.DOM 조작의 문제는 느리다는 것. 특히 여러 번 수정하면 브라우저가 매번 화면을 다시 그려야 해서 성능이 떨어짐.그래서 Vue 같은 프레임워크들이 가상..

2026. 2. 5. 14:15
SKALA

HTML, CSS, JavaScript

1. 인터넷과 웹의 기초인터넷(Internet): 전 세계 컴퓨터가 연결된 물리적 네트워크의 집합체로, TCP/IP 프로토콜을 사용웹(WWW): 인터넷 위에서 돌아가는 서비스 중 하나로, 하이퍼텍스트를 통해 정보 공유작동 원리: 클라이언트(브라우저)가 서버에 요청(Request)을 보내면, 서버는 HTML 등의 자원으로 응답(Response)하는 구조2. HTML 개요정의: HyperText Markup Language의 약자로, 웹 페이지의 구조와 내용을 정의하는 마크업 언어특징: 태그()를 사용하여 요소를 정의하며, 브라우저는 이 코드를 해석(렌더링)하여 사용자에게 화면을 보여줌기본 구조:: 문서의 형식을 선언.: 전체 문서의 시작과 끝.: 문서 정보(메타데이터, 제목)를 포함.: 실제 화면에 나타나..

2026. 2. 5. 14:13
SKALA

생성형 AI 기초 및 Prompt Engineering

1. 생성형 AI의 이해정의: 대규모 데이터를 학습하여 텍스트, 이미지, 음성 등 새로운 콘텐츠를 자율적으로 만들어내는 인공지능 기술트렌드 (Hype Cycle): 생성형 AI는 현재 '기대의 정점'을 지나 실제 비즈니스 가치를 창출하는 단계로 진입하고 있음패러다임의 변화: 단순한 '분류 및 예측'에서 인간과 유사한 '창작 및 추론'이 가능한 단계로 진입2. NLP 기술의 발전 (RNN에서 Transformer까지)RNN/LSTM: 순차적으로 데이터를 처리하여 긴 문맥 유지에 한계가 있었음Transformer: 'Attention' 메커니즘을 통해 문장 내 단어 간의 관계를 한 번에 파악(병렬 처리)하며 성능이 비약적으로 발전LLM(거대언어모델): 매개변수(Parameter)의 수가 일정 수준을 넘어서면..

2026. 2. 3. 10:19
SKALA

Vector Database

1. 데이터베이스의 진화 배경기존 데이터베이스(RDB)가 실패한 것이 아니라, AI 서비스의 등장으로 질문의 성격이 바뀌었기 때문에 Vector DB 등장정형 데이터 시대 (RDB): 입금 내역, 계좌 잔액 등 정확한 기록과 계산, '얼마인가', '존재하는가'와 같은 질문에 최적화되어 있음비정형 데이터 폭증: 이메일, 문서, 로그 등 데이터가 늘어났으나 RDB는 파일의 위치만 알 뿐 내용은 알지 못함.AI 서비스 시대: 사용자는 정확한 키워드 대신 '의미 중심'으로 질문하며, 이에 답하기 위해 상세 파일 내용에 접근할 수 있는 DB가 필요해짐2. RDB vs Vector DB 비교구분Relational DB (RDB)Vector DB목적값을 저장하고 비교의미를 숫자 벡터로 저장하고 비교데이터 관리값 중심..

2026. 2. 2. 09:39
SKALA

LLM 모델 이해 및 활용(2)

실전 프로젝트 구성 및 Agentic AI1. AI 프로젝트 실무 접근법 프로젝트 단계PoC (Proof of Concept): 개념 검증MVP (Minimum Viable Product): 최소 기능 제품핵심 프로세스이해관계자 Pain Point → AI Service 선정 (Predictive/Generative) → Architecture 설계 (Front/Back) → 구현 및 검증 중요 체크포인트이해관계자 가치가 명확히 반영되었는가?비즈니스적 가치를 고려했는가?왜 LLM인가? 왜 Agentic AI인가?2. AI 진화의 흐름 ​AI 단계주요 목적대표 모델핵심 기술기술적 한계윤리적 문제Cognitive AI (Perception AI)인간 감각 인식CNN, RNN이미지·음성·텍스트 인식의미 이해..

2026. 2. 2. 09:39