본문 바로가기

전체 글364

Laravel Inertia - Links 링크 Inertia 앱 내에서 다른 페이지로의 링크를 생성할 때는 일반적으로 Inertia 컴포넌트를 사용합니다. 이 컴포넌트는 표준 앵커() 링크를 둘러싼 가벼운 래퍼로, 클릭 이벤트를 가로채고 전체 페이지 새로고침을 방지합니다. 이를 통해 애플리케이션이 로드된 후 싱글 페이지 앱 경험을 제공합니다. 링크 생성하기 Inertia 링크를 생성하려면 Inertia 컴포넌트를 사용하세요. 이 컴포넌트에 제공된 모든 속성은 기본 HTML 태그로 전달됩니다. import { Link } from '@inertiajs/vue3' Home 기본적으로 Inertia는 링크를 앵커() 요소로 렌더링합니다. 그러나 as 속성을 사용하여 태그를 변경할 수 있습니다. import { Link } from &#.. 2024. 1. 18.
Laravel Inertia - Title & meta 타이틀 & 메타 Inertia로 구동되는 JavaScript 애플리케이션은 문서의 내에서 렌더링되므로, 문서의 타이틀 축약형 문서의 여러 Head 인스턴스 애플리케이션 전체에 걸쳐 여러 // About.vue import { Head } from '@inertiajs/vue3' Inertia는 한 번에 하나의 태그만 렌더링하지만, 다른 태그는 여러 인스턴스가 있을 수 있기 때문에 쌓입니다. 중복 태그를 피하기 위해 head-key 속성을 사용할 수 있으며, 이는 태그가 한 번만 렌더링되도록 보장합니다. 위 예제에서 태그에 대해 이를 설명합니다. 위 코드 예제는 다음 HTML을 렌더링합니다. Head 확장 실제 애플리케이션을 구축할 때, Inertia의 사용자 정의 컴포넌트를 생성한 후에는 .. 2024. 1. 18.
Laravel Inertia - Routing 라우팅 라우트 정의하기 Inertia를 사용할 때, 애플리케이션의 모든 라우트는 서버 측에서 정의됩니다. 이는 Vue Router나 React Router가 필요하지 않다는 것을 의미합니다. 대신, Laravel 라우트를 정의하고 해당 라우트에서 Inertia 응답을 반환하기만 하면 됩니다. 간편한 라우트 "FAQ"나 "about" 페이지처럼 해당 컨트롤러 메소드가 필요 없는 페이지가 있다면, Route::inertia() 메소드를 통해 컴포넌트로 직접 라우팅할 수 있습니다. Route::inertia('/about', 'About');URL 생성하기 일부 서버 측 프레임워크는 명명된 라우트에서 URL을 생성할 수 있습니다. 그러나 클라이언트 측에서 이러한 헬퍼에 접근할 수는.. 2024. 1. 18.
Laravel Inertia - Redirects 리다이렉트 Inertia를 사용하여 non-GET 요청을 수동으로 하거나 요소를 통해 수행할 때, 항상 적절한 Inertia 리다이렉트 응답으로 응답하는 것이 중요합니다. 예를 들어, 컨트롤러가 새로운 사용자를 생성하는 경우, "store" 엔드포인트는 사용자 "index" 페이지와 같은 표준 GET 엔드포인트로 리다이렉트되어야 합니다. Inertia는 이 리다이렉트를 자동으로 따라가고 페이지를 그에 맞게 업데이트합니다. class UsersController extends Controller { public function index() { return Inertia::render('Users/Index', [ 'users' => User::all(), ]); } publi.. 2024. 1. 18.
Laravel Inertia - Responses Responses 응답 Creating responses 응답 생성하기 Inertia 응답을 생성하는 것은 간단합니다. 시작하려면, 컨트롤러나 라우트 내에서 Inertia::render() 메소드를 호출하고, 렌더링하고자 하는 JavaScript 페이지 컴포넌트의 이름과 페이지에 대한 props(데이터)를 제공하면 됩니다. 아래 예제에서, 단일 prop(event)을 Event/Show 페이지 컴포넌트에 전달합니다. 이 prop에는 네 개의 속성(id, title, start_date, description)이 포함됩니다. use Inertia\Inertia; class EventsController extends Controller { public function show(Event $event) { .. 2024. 1. 18.
Laravel Inertia - Pages Inertia 를 사용하여 애플리케이션을 구축할 때, 애플리케이션의 각 페이지는 일반적으로 자체 컨트롤러/라우트와 해당하는 JavaScript 컴포넌트를 가집니다. 이를 통해 해당 페이지에 필요한 데이터만 검색할 수 있으며, API는 필요하지 않습니다. 또한, 페이지에 필요한 모든 데이터는 브라우저에서 페이지가 렌더링되기 전에 검색될 수 있어, 사용자가 애플리케이션을 방문할 때 "loading" 상태를 표시할 필요가 없어집니다. Creating pages 페이지 생성하기 Inertia 페이지는 단순히 JavaScript 컴포넌트입니다. Vue, React, 또는 Svelte 컴포넌트를 작성해본 적이 있다면 금방 익숙해질 것입니다. 아래 예시에서 볼 수 있듯이, 페이지는 애플리케이션의 컨트롤러로부터 pro.. 2024. 1. 18.
Chat Plugins - productionizing your plugin Rate limits 노출된 API 엔드포인트에 대해 속도 제한을 구현하는 것을 고려하세요. ChatGPT는 429 응답 코드를 존중하며, 짧은 시간 내에 일정 수의 429 또는 500 응답을 받은 후 플러그인에 요청을 보내는 것을 동적으로 줄입니다. Timeouts 플러그인 경험 중 API 호출을 할 때, 다음 임계값을 초과하면 타임아웃이 발생합니다: ai-plugin.json/openapi.yaml을 가져오는 데 걸리는 왕복 시간 15초 API 호출을 위한 왕복 시간 45초 플러그인 경험을 더 많은 사람들에게 확장함에 따라, 타임아웃 임계값이 감소할 것으로 예상합니다. Rate limiting users 저희는 지속적인 사용자 수준 ID를 노출하지 않고, 대신 플러그인에 보내는 요청에 openai-e.. 2024. 1. 12.
Chat Plugins - plugin authentication 플러그인은 다양한 사용 사례를 수용할 수 있도록 여러 인증 스키마를 제공합니다. 플러그인의 인증 스키마를 지정하려면 매니페스트 파일을 사용하세요. 우리의 플러그인 도메인 정책은 도메인 보안 문제를 해결하기 위한 전략을 개요합니다. 사용 가능한 인증 옵션의 예시는 예시 섹션을 참조하세요. 여기에는 모든 다양한 선택 사항을 설명하였습니다. ai-plugin.json 파일은 인증 스키마를 설정해야 합니다. 인증을 사용하지 않기로 선택하더라도 "auth": { "type": "none" }을 명시하는 것이 필요합니다. 서비스, 사용자 또는 OAuth 인증을 사용하려면 원격 서버를 설정해야 합니다. Service level 개발자가 자신의 플러그인 사용 방식을 제어할 수 있으면서도 사용자에게 부담을 주지 않는 방.. 2024. 1. 12.
Chat Plugins - Example 플러그인을 구축하기 시작하기 위해, 다양한 인증 스키마와 사용 사례를 다루는 간단한 플러그인 세트를 제공하고 있습니다. 인증이 필요 없는 간단한 할 일 목록 플러그인부터 더 강력한 검색 플러그인에 이르기까지, 이 예시들은 플러그인으로 가능하게 하고자 하는 것을 엿볼 수 있게 해줍니다. 개발 중에는 GitHub Codespaces, Replit, 또는 CodeSandbox와 같은 클라우드 개발 환경을 통해 플러그인을 실행할 수 있습니다. Plugin quickstart 플러그인 퀵스타트는 개발자들이 5분 이내에 플러그인을 설정하고 실행할 수 있는 시작점으로 만들어졌습니다. 아직 플러그인을 실행해보지 않았고 하나를 실행하는 데 필요한 최소한의 단계에 익숙해지고 싶다면, 플러그인 퀵스타트 저장소로 시작하는 것.. 2024. 1. 12.
Chat Plugins - Get started 플러그인을 만드는 것은 다음 세 단계로 구성됩니다: API 구축 OpenAPI yaml 또는 JSON 형식으로 API 문서화 플러그인에 대한 관련 메타데이터를 정의하는 JSON 매니페스트 파일 생성 이 섹션의 나머지 부분에서는 OpenAPI 사양과 매니페스트 파일을 정의하여 할 일 목록(todo list) 플러그인을 만드는 방법에 중점을 둘 것입니다. Plugin manifest 모든 플러그인에는 ai-plugin.json 파일이 필요하며, 이 파일은 API가 호스팅되는 도메인에 호스팅되어야 합니다. 예를 들어, example.com이라는 회사는 그들의 API가 호스팅되는 https://example.com 도메인을 통해 플러그인 JSON 파일에 접근할 수 있도록 해야 합니다. ChatGPT UI를 통해.. 2024. 1. 12.
Chat Plugins GPT와 맞춤형 액션이 도착했습니다! 우리는 특정 목적을 위해 만들 수 있는 ChatGPT의 맞춤형 버전을 출시하고 있습니다. 이것을 GPT라고 부릅니다. GPT는 누구나 일상 생활, 특정 작업, 직장 또는 가정에서 더 유용하게 사용할 수 있는 맞춤형 ChatGPT를 만들고 다른 사람들과 공유할 수 있는 새로운 방법입니다. 플러그인을 기반으로 하는 액션을 발표하게 되어 기쁩니다. 액션은 플러그인의 핵심 아이디어를 많이 활용하는 동시에 빌더들이 요청해 온 많은 새로운 기능들을 도입합니다. Introduction OpenAI 플러그인은 ChatGPT를 타사 애플리케이션에 연결합니다. 이러한 플러그인을 통해 ChatGPT는 개발자들이 정의한 API와 상호 작용할 수 있으며, ChatGPT의 능력을 향상시키고 .. 2024. 1. 11.
Actions in GPTs GPT와 맞춤형 액션들이 도착했습니다! 우리는 특정 목적을 위해 만들 수 있는 ChatGPT의 맞춤형 버전을 출시하고 있습니다. 이것을 GPT라고 부릅니다. GPT는 누구나 일상 생활, 특정 작업, 직장 또는 가정에서 더 유용하게 사용할 수 있는 맞춤형 ChatGPT를 만들고 다른 사람들과 공유할 수 있는 새로운 방법입니다. 플러그인을 기반으로 하는 액션을 발표하게 되어 기쁩니다. 액션은 플러그인의 핵심 아이디어를 많이 활용하는 동시에 빌더들이 요청해 온 많은 새로운 기능들을 도입합니다. What is a GPT? GPT는 ChatGPT를 전혀 새로운 기능으로 깊이 있게 맞춤 설정할 수 있는 능력을 제공합니다. 또한 GPT는 빌더들의 진입 장벽을 낮춥니다. GPT 출시 블로그 포스트와 OpenAI 개발자.. 2024. 1. 11.
Laravel Inertia Client-side 설치 Inertia.js의 클라이언트 측 설정 과정은 서버 측 프레임워크를 설정한 후에 이루어집니다. Inertia는 현재 React, Vue, Svelte를 지원합니다. Laravel starter kits Laravel의 스타터 키트인 Breeze와 Jetstream은 Inertia 애플리케이션을 위한 준비된 스캐폴딩을 제공합니다. 이 스타터 키트들은 Laravel 및 Vue 또는 React를 사용하여 새로운 Inertia 프로젝트를 시작하는 가장 빠른 방법입니다. 수동으로 Inertia를 설치하려면 아래 문서를 참조하십시오. Install dependencies 우선, 선택한 프레임워크에 해당하는 Inertia 클라이언트 측 어댑터를 설치합니다. npm install @inertiajs/vue3 Init.. 2024. 1. 10.
Laravel Inertia Server-side 설치 Inertia.js 서버 측 설정의 첫 단계는 서버 측 프레임워크를 구성하는 것입니다. Inertia는 Laravel을 위한 공식 서버 측 어댑터를 유지하고 있습니다. 다른 프레임워크를 사용하는 경우 해당 어댑터가 유지하는 프레임워크별 문서를 참조하십시오. Laravel Stater kits Laravel의 스타터 키트인 Breeze와 Jetstream은 Inertia 애플리케이션을 위한 즉시 사용 가능한 스캐폴딩을 제공합니다. 이러한 스타터 키트는 Laravel 및 Vue 또는 React를 사용하여 새로운 Inertia 프로젝트를 시작하는 가장 빠른 방법입니다. 그러나 Inertia를 수동으로 설치하려면 아래 내용을 참조하십시오. Install dependencies 먼저 Composer 패키지 관리자.. 2024. 1. 10.
Laravel Jetstream Livewire Laravel Livewire는 Laravel Blade를 템플릿 언어로 사용하여 현대적이고 반응적이며 동적인 인터페이스를 간단하게 구축할 수 있는 라이브러리입니다. 동적이고 반응적인 애플리케이션을 구축하고 싶다면 이 스택을 선택하는 것이 좋으며, Vue.js와 같은 전체 JavaScript 프레임워크에 대한 훌륭한 대안입니다. Livewire를 사용할 때, 애플리케이션의 라우트는 일반적인 Blade 템플릿으로 응답합니다. 그러나 이러한 템플릿 내에서 필요에 따라 Livewire 컴포넌트를 렌더링할 수 있습니다: @livewire('server-list') Livewire 스택을 사용할 때, Jetstream은 몇 가지 독특한 기능을 가지고 있는데, 이에 대해 알아야 합니다. 아래에서 이러한 기능들에 대.. 2024. 1. 8.