
Understanding Svelte 5 Runes: The Future of Reactivity
Dive deep into Svelte 5's new rune system and discover how it revolutionizes state management and reactivity.

네이티브 앱 같은 페이지 전환을 웹에서 구현하세요.
Next.js, Nuxt, SvelteKit 등 모든 SSR 프레임워크와 완벽 호환. SEO를 포기하지 않고도 멋진 애니메이션을 만들 수 있습니다.
React
npm install @ssgoi/react
Svelte
npm install @ssgoi/svelte
Vue (지원 예정)
npm install @ssgoi/vue
SolidJS (지원 예정)
npm install @ssgoi/solid
Qwik (지원 예정)
npm install @ssgoi/qwik
Insights on Svelte, Flutter, and web development
Dive deep into Svelte 5's new rune system and discover how it revolutionizes state management and reactivity.
Learn how to create beautiful, performant animations in Flutter that bring your mobile apps to life.
A comprehensive guide to architecting large-scale applications with SvelteKit, covering best practices, patterns, and real-world examples.
Understanding the revolutionary React Server Components and how they change the way we build React applications.
Explore the latest CSS features including Container Queries, Cascade Layers, and the :has() selector that are revolutionizing web styling.
Master the art of web performance with modern techniques including Core Web Vitals optimization, resource hints, and cutting-edge loading strategies.
Level up your TypeScript skills with advanced patterns including type guards, conditional types, and template literal types.
프레임워크에 관계없이 일관된 API로 사용하세요
단 3가지만 기억하세요
Next.js, Nuxt, SvelteKit 같은 SSR 프레임워크에서 완벽하게 작동. SEO를 포기하지 않고도 멋진 페이지 전환을 구현하세요.
Chrome, Firefox, Safari 모든 브라우저에서 일관된 경험을 제공합니다.
프레임워크의 라우팅을 그대로 이용하세요. 복잡한 설정 없이 바로 시작할 수 있습니다.
단 몇 줄로 페이지 전환 애니메이션을 구현하세요
// app/layout.tsx
import { Ssgoi, SsgoiConfig } from '@ssgoi/react'
import { fade, hero } from '@ssgoi/react/view-transitions'
const config: SsgoiConfig = {
transitions: [
{
from: "/*", to: "/profile", transition: fade()
},
{
from: "/posts", to: "/posts/*", transition: hero()
},
],
}
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<Ssgoi config={config}>
{children}
</Ssgoi>
)
}
// app/posts/page.tsx
import { SsgoiTransition } from '@ssgoi/react'
export default function PostsPage() {
return (
<SsgoiTransition id="/posts">
<div>
<h1>Posts List</h1>
{/* Page Content */}
</div>
</SsgoiTransition>
)
}