├── .env ├── .gitignore ├── README.md ├── jsconfig.json ├── next.config.js ├── package.json ├── pages ├── _app.js ├── _document.js ├── api │ └── generate-regex.js └── index.js ├── pnpm-lock.yaml ├── postcss.config.js ├── public ├── favicon.ico ├── next.svg └── vercel.svg ├── screenshot.png ├── styles └── globals.css └── tailwind.config.js /.env: -------------------------------------------------------------------------------- 1 | OPENAI_API_KEY=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 2 | CHATGPT_MODEL=gpt-3.5-turbo 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | .idea 8 | 9 | # testing 10 | /coverage 11 | 12 | # next.js 13 | /.next/ 14 | /out/ 15 | 16 | # production 17 | /build 18 | 19 | # misc 20 | .DS_Store 21 | *.pem 22 | 23 | # debug 24 | npm-debug.log* 25 | yarn-debug.log* 26 | yarn-error.log* 27 | 28 | # local env files 29 | .env*.local 30 | 31 | # vercel 32 | .vercel 33 | 34 | # typescript 35 | *.tsbuildinfo 36 | next-env.d.ts 37 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # ChatGPT API ile Regex Uygulaması 2 | 3 | ![](./screenshot.png) 4 | 5 | Düzenli ifadeleri türetmek oldukça yorucu ve sıkıcı bir süreç. Bu yüzden ihtiyacınız olan şeyi türkçe anlatın, regex'ce cevap bulun :) Bu uygulamayı prototurk'de anlattığım [derste](https://www.youtube.com/watch?v=X8HrToBr5Hg) birlikte geliştirdik. 6 | 7 | ``` 8 | pnpm install && pnpm dev 9 | ``` 10 | 11 | `.env` dosyasında `OPENAI_API_KEY` ve `CHATGPT_MODEL` için kendi değer tanımlarınızı yapmayı unutmayın. 12 | -------------------------------------------------------------------------------- /jsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "paths": { 4 | "@/*": ["./*"] 5 | } 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /next.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('next').NextConfig} */ 2 | const nextConfig = { 3 | reactStrictMode: true, 4 | } 5 | 6 | module.exports = nextConfig 7 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "openai", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "dev": "next dev", 7 | "build": "next build", 8 | "start": "next start", 9 | "lint": "next lint" 10 | }, 11 | "dependencies": { 12 | "autoprefixer": "10.4.14", 13 | "next": "13.3.0", 14 | "openai": "^3.2.1", 15 | "postcss": "8.4.21", 16 | "react": "18.2.0", 17 | "react-dom": "18.2.0", 18 | "tailwindcss": "3.3.1" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /pages/_app.js: -------------------------------------------------------------------------------- 1 | import '@/styles/globals.css' 2 | 3 | export default function App({ Component, pageProps }) { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /pages/_document.js: -------------------------------------------------------------------------------- 1 | import { Html, Head, Main, NextScript } from 'next/document' 2 | 3 | export default function Document() { 4 | return ( 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /pages/api/generate-regex.js: -------------------------------------------------------------------------------- 1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction 2 | 3 | import {Configuration, OpenAIApi} from "openai" 4 | 5 | const configuration = new Configuration({ 6 | apiKey: process.env.OPENAI_API_KEY, 7 | }); 8 | const openai = new OpenAIApi(configuration); 9 | 10 | const systemPrompt = `sen kullanıcıdan aldığın bilgiye göre regex deseni üreten bir araçsın. 11 | 12 | kullanıcı sana bir soru sorduğunda, bununla ilgili bir regex deseni üretebiliyorsan şu formatta bir JSON döndüreceksin: 13 | 14 | { 15 | "description": "kullanıcının istediği regex örneğine ait başlık", 16 | "pattern": "ilgili regex kodu", 17 | "example": "kullanıcının sorusuna göre üretilmiş regex deseninin kullanıldığı örnek javascript kodu" 18 | } 19 | 20 | Eğer kullanıcıdan aldığın bilginin bir regex karşılığı yoksa "NO_REGEX" döndür.` 21 | 22 | export default async function handler(req, res) { 23 | 24 | const body = JSON.parse(req.body) 25 | 26 | if (!body?.query) { 27 | res.status(404).json({ 28 | message: 'Hata yaptin gardas!' 29 | }) 30 | } 31 | 32 | const completion = await openai.createChatCompletion({ 33 | model: process.env.CHATGPT_MODEL, 34 | messages: [ 35 | { 36 | role: "system", 37 | content: systemPrompt 38 | }, 39 | { 40 | role: "user", 41 | content: body.query 42 | } 43 | ], 44 | }); 45 | 46 | let response = { 47 | error: true 48 | } 49 | 50 | /* 51 | BURAYI KENDI YAZDIGIMIZ 52 | REGEX GENERATOR KULLANARAK 53 | GELEN RESPONSE ICINDEN 54 | JSON DATAYI PARSE EDECEK 55 | REGEX KODUYLA DEGISTIRDIM :D 56 | SONUC OLARAK ISE YARADI! 57 | */ 58 | const string = completion.data.choices[0].message.content; 59 | const regex = /(^|\s)\{[\w\s\S]*\}(?=\s|$)/; 60 | const match = string.match(regex); 61 | 62 | if (match) { 63 | response = JSON.parse(match[0]); 64 | } 65 | 66 | res.status(200).json(response) 67 | } 68 | -------------------------------------------------------------------------------- /pages/index.js: -------------------------------------------------------------------------------- 1 | import {useState} from "react"; 2 | 3 | export default function Home() { 4 | 5 | const [loading, setLoading] = useState(false) 6 | const [query, setQuery] = useState('') 7 | const [result, setResult] = useState(false) 8 | const [error, setError] = useState(false) 9 | 10 | const submitHandle = e => { 11 | e.preventDefault() 12 | setLoading(true) 13 | fetch('/api/generate-regex', { 14 | method: 'post', 15 | body: JSON.stringify({ 16 | query 17 | }) 18 | }) 19 | .then(res => res.json()) 20 | .then(res => { 21 | if (res?.error) { 22 | setError('Regex deseni üretemiyorum, doğru bir şey istediğinden emin misin? LAN.') 23 | setResult(false) 24 | } else { 25 | setResult(res) 26 | setError(false) 27 | } 28 | setQuery('') 29 | }) 30 | .finally(() => setLoading(false)) 31 | } 32 | 33 | return ( 34 |
35 |
36 |
37 |
38 | REGEXHUB 39 |
40 |

41 | İhtiyacınız olan regex üretim aracı! 42 |

43 |
44 | 45 |
46 |