Skip to content

Commit

Permalink
Merge pull request #1205 from samchon/doc/intro
Browse files Browse the repository at this point in the history 
Intro page
  • Loading branch information
@samchon
samchon authored Jan 26, 2025
2 parents 01f864f + d44f198 commit 42c7b40
Show file tree
Hide file tree
Showing 6 changed files with 132 additions and 142 deletions.
92 changes: 1 addition & 91 deletions website/pages/docs/swagger/chat.mdx
View file
Original file line number Diff line number Diff line change
@@ -1,95 +1,5 @@
import FaceIcon from "@mui/icons-material/Face";
import SmartToyIcon from "@mui/icons-material/SmartToy";
import { Card, CardContent, Chip } from "@mui/material";
import { Callout, Tabs } from 'nextra/components'

{/* ## Preface
<br/>
<div
style={{
width: "100%",
padding: 15,
backgroundColor: "lightblue",
}}
>
<div
style={{
display: "flex",
justifyContent: "flex-end",
}}
>
<Card
elevation={3}
style={{
marginTop: 10,
marginBottom: 10,
marginLeft: "10%",
textAlign: "right",
backgroundColor: "lightyellow",
}}
>
<CardContent>
<Chip
icon={<FaceIcon />}
label={<b><u>User</u></b>}
variant="outlined"
color="primary"
/>
What you can do? Introduce yourself, please.
</CardContent>
</Card>
</div>
<div
style={{
display: "flex",
justifyContent: "flex-start",
}}>
<Card
elevation={3}
style={{
marginTop: 10,
marginBottom: 10,
marginRight: "10%",
}}
>
<CardContent>
<Chip
icon={<SmartToyIcon />}
label={<b><u>Assistant</u></b>}
variant="outlined"
color="success"
/>
I can assist you with various functions related to shopping, including:
1. **Order Management**
- Create new orders from a shopping cart or directly without a cart.
- List your existing orders.
- Get detailed information about a specific order.
2. **Coupons and Discounts**
- List available coupons.
- Get details about specific coupons.
- Create new coupon tickets.
3. **Sales and Reviews**
- List and get details about sales.
- Write questions and reviews for sales.
If you have a specific action in mind or need help in a certain area, just let me know!
</CardContent>
</Card>
</div>
</div>
Chat with your backend server.
You can build a Super A.I. chatbot application from swagger documents performing the LLM function calling.
The super A.I. chatbot selects proper functions defined in the swagger document by analyzing conversation contexts with user. And then the super A.I. chatbot requests the user to write arguments for the selected functions by conversation text, and actually calls the API function with the arguments.
If the swagger file you provide contains a reasonable level of functions, DTO schemas, and descriptions, everything is ready. Just deliver the swagger file to the Nestia A.I. Chatbot, you can start conversation with your backend server calling the API functions by chatting text. */}




## Super A.I. Chatbot
<br/>
<iframe src="https://www.youtube.com/embed/m47p4iJ90Ms?si=cvgfckN25GJhjLTB"
Expand All @@ -102,7 +12,7 @@ If the swagger file you provide contains a reasonable level of functions, DTO sc

- Shopping A.I. Chatbot Application: [https://nestia.io/chat/shopping](/chat/shopping)
- Shopping Backend Repository: https://github.com/samchon/shopping-backend
- Shopping Swagger Document (`@nestia/editor`): https://shopping-be.wrtn.ai/editor/
- Shopping Swagger Document (`@nestia/editor`): [https://nestia.io/editor/?url=...](https://nestia.io/editor/?simulate=true&e2e=true&url=https%3A%2F%2Fraw.githubusercontent.com%2Fsamchon%2Fshopping-backend%2Frefs%2Fheads%2Fmaster%2Fpackages%2Fapi%2Fswagger.json)

The above demonstration video shows Shopping A.I. chatbot built with Nestia.

Expand Down
1 change: 1 addition & 0 deletions website/public/images/home/openai.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
7 changes: 7 additions & 0 deletions website/public/images/home/websocket.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion website/src/movies/home/HomeHeroMovie.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@ import GitHubIcon from "@mui/icons-material/GitHub";
import MenuBookIcon from "@mui/icons-material/MenuBook";
import { Button, Grid, Typography } from "@mui/material";
import { ReactNode } from "react";
import React from "react";

import ProductHeroLayout from "../../components/home/ProductHeroLayout";
import React from "react";

const BLUE = "rgb(0, 200, 255)";
const CYAN = "rgb(80, 200, 0)";
Expand Down
84 changes: 68 additions & 16 deletions website/src/movies/home/HomeStrengthMovie.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,9 @@ import HomeCodeBlock from "../../components/home/HomeCodeBlock";
import HomeStrengthSectionMovie from "./HomeStrengthSectionMovie";

const BLUE = "rgb(0, 200, 255)";
const CYAN = "rgb(80, 200, 0)";
const GREEN = "rgb(80, 200, 0)";
const PURPLE = "rgb(191, 64, 191)";
const YELLOW = "#DEC20B";

const sections: HomeStrengthSectionMovie.Props[] = [
{
Expand All @@ -16,7 +17,7 @@ const sections: HomeStrengthSectionMovie.Props[] = [
<span style={{ color: PURPLE }}>@</span>
<span style={{ color: BLUE }}>TypedBody()</span>
<span style={{ color: "gray" }}>{" input: "}</span>
<span style={{ color: CYAN }}>IArticleCreate</span>
<span style={{ color: GREEN }}>IArticleCreate</span>
</React.Fragment>
),
description: (
Expand Down Expand Up @@ -55,14 +56,14 @@ const sections: HomeStrengthSectionMovie.Props[] = [
</React.Fragment>
),
image: "/images/home/sdk.png",
href: "/docs/sdk/sdk",
href: "/docs/sdk",
},
{
title: "Mockup Simulator",
subTitle: (
<React.Fragment>
<span style={{ color: "gray" }}>{"{ "}</span>
<span style={{ color: CYAN }}>{"simulate: "}</span>
<span style={{ color: GREEN }}>{"simulate: "}</span>
<span style={{ color: BLUE }}>{"true"}</span>
<span style={{ color: "gray" }}>{" }"}</span>
</React.Fragment>
Expand All @@ -71,7 +72,7 @@ const sections: HomeStrengthSectionMovie.Props[] = [
<React.Fragment>
<p>Mockup Simulator embedded in SDK.</p>
<br />
<p>Simulates validation and response of the backend.</p>
<p>Simulates backend API.</p>
<br />
<p>
Based on{" "}
Expand All @@ -80,38 +81,89 @@ const sections: HomeStrengthSectionMovie.Props[] = [
<span style={{ color: "gray" }}>.</span>
<span style={{ color: PURPLE }}>assert</span>
<span style={{ color: "gray" }}>{"<"}</span>
<span style={{ color: CYAN }}>T</span>
<span style={{ color: "gray" }}>{">()"}</span>
</i>{" "}
and{" "}
<span style={{ color: GREEN }}>T</span>
<span style={{ color: "gray" }}>{">"}</span>
</i>
,{" "}
<i>
<span style={{ color: BLUE }}>typia</span>
<span style={{ color: "gray" }}>.</span>
<span style={{ color: PURPLE }}>random</span>
<span style={{ color: "gray" }}>{"<"}</span>
<span style={{ color: CYAN }}>T</span>
<span style={{ color: "gray" }}>{">()"}</span>
<span style={{ color: GREEN }}>T</span>
<span style={{ color: "gray" }}>{">"}</span>
</i>
</p>
</React.Fragment>
),
image: "/images/home/random.png",
href: "/docs/sdk/simulator",
href: "/docs/sdk/simulate",
},
{
title: "WebSocket RPC",
subTitle: (
<React.Fragment>
<span style={{ color: PURPLE }}>@</span>
<span style={{ color: BLUE }}>{"WebSocketRoute"}</span>
{"."}
<span style={{ color: YELLOW }}>{"Acceptor()"}</span>
</React.Fragment>
),
description: (
<React.Fragment>
<p>WebSocket RPC with NestJS.</p>
<br />
<p>
Much easier than <HomeCodeBlock>@WebSocketGateway()</HomeCodeBlock>.
</p>
<br />
<p>Supports SDK library generation</p>
</React.Fragment>
),
image: "/images/home/websocket.svg",
href: "/docs/core/WebSocketRoute",
},
{
title: "TS OpenAPI Generator",
subTitle: <HomeCodeBlock>npx @nestia/migrate</HomeCodeBlock>,
title: "TypeScript Swagger Editor",
subTitle: (
<React.Fragment>
<span style={{ color: BLUE }}>TypeScript IDE</span>
{" + "}
<span style={{ color: GREEN }}>Swagger/UI</span>
</React.Fragment>
),
description: (
<React.Fragment>
<p>Web based TypeScript Editor</p>
<p>Web based TypeScript Editor IDE</p>
<br />
<p>Swagger to NestJS/SDK</p>
<br />
<p>Supports Mockup Simulator</p>
</React.Fragment>
),
image: "/images/home/swagger.png",
href: "/docs/editor",
href: "/docs/swagger/editor",
},
{
title: "Super A.I. Chatbot",
subTitle: (
<React.Fragment>
<span style={{ color: BLUE }}>A.I. Chatbot</span>
{" by "}
<span style={{ color: GREEN }}>Swagger Document</span>
</React.Fragment>
),
description: (
<React.Fragment>
<p>Swagger operations to LLM function schemas</p>
<br />
<p>Converse your backend server to A.I. chatbot</p>
<br />
<p>The best tool for A.I. chatbot development</p>
</React.Fragment>
),
image: "/images/home/openai.svg",
href: "/docs/swagger/chat",
},
];

Expand Down
88 changes: 54 additions & 34 deletions website/src/movies/home/HomeStrengthSectionMovie.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,46 +6,66 @@ import {
Grid,
Typography,
} from "@mui/material";
import { useState } from "react";

const HomeStrengthSectionMovie = (props: HomeStrengthSectionMovie.Props) => (
<Grid item xs={12} md={6}>
<Box>
<CardActionArea href={props.href}>
<br />
<div
style={{
alignItems: "center",
justifyContent: "center",
display: "flex",
}}
const HomeStrengthSectionMovie = (props: HomeStrengthSectionMovie.Props) => {
const [over, setOver] = useState(false);
return (
<Grid item xs={12} md={6} lg={4}>
<Box>
<CardActionArea
href={props.href}
onMouseOver={() => setOver(true)}
onMouseOut={() => setOver(false)}
>
<Box
component="img"
src={props.image}
sx={{
width: props.width,
height: props.height ?? 100,
<br />
<div
style={{
alignItems: "center",
justifyContent: "center",
display: "flex",
}}
/>
</div>
<br />
<CardContent style={{ textAlign: "center" }}>
<Typography variant="h5">{props.title}</Typography>
<Typography color="default" sx={{ paddingTop: 0.5 }}>
{props.subTitle}
</Typography>
>
<Box
component="img"
src={props.image}
sx={{
width: props.width,
height: props.height ?? 100,
}}
/>
</div>
<br />
{props.description}
</CardContent>
</CardActionArea>
<Divider />
</Box>
</Grid>
);
<CardContent style={{ textAlign: "center" }}>
<Typography
variant="h5"
sx={{
textDecoration: over ? "underline" : undefined,
}}
>
{props.title}
</Typography>
<Typography
color="default"
sx={{
paddingTop: 0.5,
}}
>
{props.subTitle}
</Typography>
<br />
{props.description}
</CardContent>
</CardActionArea>
<Divider />
</Box>
</Grid>
);
};
namespace HomeStrengthSectionMovie {
export interface Props {
title: string;
subTitle: JSX.Element;
title: string | JSX.Element;
subTitle: string | JSX.Element;
description: JSX.Element;
image: string;
href: string;
Expand Down

0 comments on commit 42c7b40

Please sign in to comment.