본문 바로가기

분류 전체보기358

Hugging Face 회원가입, 토큰 발급, APIKEY 발급 방법, 개발 환경 설정 허깅페이스란? 어원? https://hunseop2772.tistory.com/371 NLP와 Hugging Face 란 어원 등 사용법🌟 AI가 언어를 이해한다는 것상상해보세요. 여러분의 스마트폰이 "배고파"라는 메시지를 받았을 때, 가까운 맛집을 추천해주거나, 긴 문서를 몇 줄로 요약해주거나, 외국어를 실시간으로 번역hunseop2772.tistory.com  1️⃣ Hugging Face 계정 만들기 Step 1: 회원가입웹사이트 접속huggingface.co 방문우측 상단 'Sign Up' 클릭 필수 정보 입력Username: 영문/숫자 조합 (예: john_doe123)Email: 실제 사용하는 이메일Password: 8자 이상, 특수문자 포함이메일 인증인증 메일 확인링크 클릭하여 인증 완료 .. 2024. 11. 15.
NLP와 Hugging Face 란 어원 등 사용법 🌟 AI가 언어를 이해한다는 것상상해보세요. 여러분의 스마트폰이 "배고파"라는 메시지를 받았을 때, 가까운 맛집을 추천해주거나, 긴 문서를 몇 줄로 요약해주거나, 외국어를 실시간으로 번역해주는 상황을... 이것이 바로 자연어 처리(NLP)의 마법입니다. NLP란 무엇일까요?자연어 처리(Natural Language Processing, NLP)는 컴퓨터가 인간의 언어를 이해하고 처리하는 기술입니다. 쉽게 말해서:카카오톡 자동 답장 추천네이버 검색어 자동 완성유튜브 자막 자동 생성 이 모든 것이 NLP 기술입니다. 🤗 Hugging Face의 이름과 역사이름의 유래Hugging Face라는 이름은 아이폰의 이모지 '🤗' (hugging face 이모지)에서 왔습니다. 이 이모지는 포옹하는 얼굴을 나타.. 2024. 11. 14.
React 애플리케이션의 고급 권한 관리 시스템 구현하기: 실제 코드와 주석으로 이해하기 0. React 애플리케이션의 권한 관리 시스템 흐름도초기 접근 프로세스사용자 접근토큰 확인토큰 유효성 검사권한 검증기능별 권한 검증 프로세스CRUD 작업별 권한 확인권한에 따른 UI 요소 표시/숨김기능 실행 전 권한 재확인에러 처리 프로세스권한 없음 처리토큰 만료 처리리프레시 실패 처리1. 소개안녕하세요! 오늘은 프로덕션 레벨의 React 애플리케이션에서 권한 관리 시스템을 어떻게 구현하는지, 상세한 코드와 주석을 통해 알아보겠습니다.2. 권한 관리의 핵심 구조2.1 withAuth HOC (Higher-Order Component)/** * 권한 검증을 위한 Higher-Order Component *@paramgssp - getServerSideProps 함수 *@paramrequiredPermis.. 2024. 11. 13.
Next.js의 라우팅 시스템 이란 1. 기본 용어 설명1.1 주요 용어라우팅(Routing): 웹 애플리케이션에서 URL에 따라 다른 페이지를 보여주는 시스템페이지(Page): Next.js에서 route와 연결된 React 컴포넌트동적 라우팅(Dynamic Routing): URL 파라미터를 사용하여 동적으로 페이지를 생성하는 방식Middleware: 페이지 렌더링 전에 실행되는 코드SSR(Server Side Rendering): 서버에서 페이지를 렌더링하는 방식CSt Side Rendering: 브라우저에서 페이지를 렌더링하는 방식1.2 Next.js 라우팅 흐름도 2. File-based 라우팅 시스템2.1 기본 구조 설명pages/ ├── index.tsx # 홈페이지 (/) ├── about.tsx # 정적 페이지 (/abou.. 2024. 11. 12.
Next.js의 렌더링 전략: SSR과 CSR, SSG (Hydration, Pre-rendering, Dynamic Routes, Build Time, ISR ) 1. 웹 렌더링의 이해1.1 렌더링이란?렌더링은 코드를 사용자가 볼 수 있는 인터페이스로 변환하는 과정입니다. 웹에서는 HTML, CSS, JavaScript를 브라우저가 이해하고 화면에 표시할 수 있는 형태로 바꾸는 것을 의미합니다.1.2 주요 용어 설명Hydration: 서버에서 보낸 정적 HTML에 JavaScript 이벤트 핸들러와 상태를 입히는 과정Pre-rendering: 미리 HTML을 생성하는 과정Dynamic Routes: URL 패턴에 따라 다른 콘텐츠를 보여주는 페이지Build Time: 애플리케이션을 배포용으로 빌드하는 시점 2. 클라이언트 사이드 렌더링 (CSR)2.1 CSR의 작동 방식const ProductPage = () => {// 상태 관리 const [product.. 2024. 11. 11.
React의 고차 컴포넌트(HOC) 1. HOC(High Order Component)란?고차 컴포넌트(HOC)는 React에서 컴포넌트 로직을 재사용하기 위한 고급 기술입니다. 코드로 보면 다음과 같습니다:/** * 기본적인 HOC 구조 *@paramWrappedComponent - 감싸질 컴포넌트 *@returns 새로운 컴포넌트 */const withSomething = (WrappedComponent) => { return class extends React.Component { render() {// 추가적인 props와 함께 컴포넌트 반환 return ; } }} 2. HOC가 필요한 이유2.1 횡단 관심사(Cross-Cutting Concerns) 해결여러 컴포넌트에서 공.. 2024. 11. 10.
React 기본 용어 및 개념 (Component, Props, State, 랜더링....) 핵심 흐름 0. React Component의 핵심 흐름React Component는 크게 4가지 핵심 요소로 구성되며, 이들이 서로 상호작용하며 동작합니다: 1. Props와 State Props: 부모가 자식에게 전달하는 데이터 State: 컴포넌트 자체적으로 관리하는 데이터 이 두 데이터는 Data Flow를 통해 앱 전체의 데이터 흐름을 만듭니다. 2. Lifecycle (생명주기) 컴포넌트가 생성되고(mount), 업데이트되고(update), 제거되는(unmount) 전체 과정을 관리 각 단계에서 필요한 작업을 수행할 수 있게 해줍니다. 3. Rendering Props나 State가 변경되면 컴포넌트를 다시 그립니다. Virtual DOM을 통해 변경사항을 효율적으로 실제 화면에 반영합니다. 4. Dat.. 2024. 11. 9.
Asterisk : AI 음성처리 시스템 흐름 및 설정 Asterisk와 AI 음성처리 시스템의 대화 흐름을 정리하면서 간단하게 예시를 들어보겠습니다. 사전에 Asterisk PBK 간단한 설명/설정과 구조에 대해서 확인하기 위해서는 하단 링크를 이동하세요 https://hunseop2772.tistory.com/363 Asterisk PBK 란? 간단한 설명/설정과 구조Asterisk PBX( 사설교환기) 1. 개요통신회사에서 음성 및 메세징 발송 관리를 하면서 이번에  Astrisk를 활용한 음성 메세지 시스템을 구축하면서 간단하게 공부한 내용을 정리하게 되었다. Asterisk란hunseop2772.tistory.com   1. 기본 대화 흐름도   2. 실제 대화 예시와 처리 과정[dialog-flow]; 1. 초기 인사exten => s,1,Answ.. 2024. 11. 8.
Oracle 데이터베이스 컬럼 조회 시 발생하는 ORA-00904 에러 해결하기 1. 문제 상황기존 웹 사이트에는 9개의 서버와 DB가 연결되어 있고 해당 GW를 1개만 작업한 경우에 발생한 문제이다. 프로젝트에서 Oracle 데이터베이스의 테이블 컬럼을 조회하는 과정에서 ORA-00904: "TYPE": invalid identifier 에러가 발생했습니다. 이 에러는 주로 존재하지 않는 컬럼을 참조하거나, 컬럼의 권한 문제로 인해 발생합니다.  1.1 에러 로그Caused by: java.sql.SQLSyntaxErrorException: ORA-00904: "TYPE": invalid identifier at oracle.jdbc.driver.T4CTTIoer11.processError(T4CTTIoer11.java:509) at oracle.jdbc.driver.T.. 2024. 11. 7.

티스토리툴바