├── .eslintrc.json ├── .gitignore ├── README.md ├── app ├── (marketing) │ ├── layout.tsx │ ├── page.tsx │ └── terminal.tsx ├── api │ └── generate-code │ │ └── route.ts ├── favicon.ico ├── fonts │ ├── GeistMonoVF.woff │ └── GeistVF.woff ├── generate │ └── page.tsx ├── globals.css ├── layout.tsx └── opengraph-image.png ├── components.json ├── components ├── codeDisplay.tsx ├── promptForm.tsx ├── spinner.tsx └── ui │ ├── button.tsx │ ├── scroll-area.tsx │ ├── select.tsx │ ├── textarea.tsx │ ├── toast.tsx │ └── toaster.tsx ├── hooks └── use-toast.ts ├── lib └── utils.ts ├── next.config.mjs ├── package-lock.json ├── package.json ├── postcss.config.mjs ├── public ├── agicode-vf.png ├── favicon.ico ├── hero.webp ├── nebius logo.png └── opengraph-image.png ├── tailwind.config.ts └── tsconfig.json /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["next/core-web-vitals", "next/typescript"] 3 | } 4 | -------------------------------------------------------------------------------- /.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 | .yarn/install-state.gz 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 | # CRAZY CODER 🚀 2 | 3 | ![Demo of CRAZY CODER](public/opengraph-image.png) 4 | 5 | Built with ❤️ using [Nebius](https://nebius.com/studio/inference?utm_medium=cpc&utm_source=crazyCoder&utm_campaign=Network_en_all_lgen_inference_cloud&utm_term=crazyCoder) 6 | 7 | --- 8 | 9 | **CRAZY CODER** is the hottest new way to write code! With the power of open-source AI models and the simplicity of natural language, you can go from idea to implementation in seconds. 10 | 11 | --- 12 | 13 | ## 🌟 Key Features 14 | 15 | ### 🔥 **The Hottest Programming Language is English** 16 | Write your ideas, pseudo-code, or simple instructions in English, and let the AI do the rest. Forget syntax and debugging headaches—focus on what matters: your creativity. 17 | 18 | ### ⚡ **Code Fast Now** 19 | No need to learn complex languages or frameworks. Get your program up and running in seconds using powerful open-source AI models like **Qwen**, **Llama**, **Mixtral**, and more. 20 | 21 | --- 22 | 23 | ## 🌐 Leverage Open Source 24 | 25 | - **Powerful Models**: Utilize cutting-edge coding models like **Qwen-2.5-Coder-32B**, which rivals GPT-4 in performance. 26 | - **Open for All**: These models are available to everyone for rapid prototyping and development. 27 | 28 | --- 29 | 30 | ## 🎨 Experiment Freely 31 | Harness the power of the **Nebius AI Studio** to experiment with different models at **low cost**. Create, test, and refine your applications in a flexible environment. 32 | 33 | 🔗 Learn more about Nebius AI Studio [here](https://nebius.com/studio/inference?utm_medium=cpc&utm_source=crazyCoder&utm_campaign=Network_en_all_lgen_inference_cloud&utm_term=crazyCoder). 34 | 35 | --- 36 | 37 | ## 💡 Want to Replicate This App? 38 | The **CRAZY CODER** project is open source! 39 | You can clone the repository and deploy it easily to **Vercel** or your favorite platform. 40 | 41 | ### 🚀 View the Code on GitHub 42 | - [Clone the repository](#) and start building today! 43 | 44 | --- 45 | 46 | ### ✨ Build Your Next Big Idea with CRAZY CODER! 47 | With **Nebius** and cutting-edge open-source models, the possibilities are endless. Start coding smarter, faster, and more creatively than ever before. 48 | 49 | --- 50 | 51 | ### 📜 License 52 | 53 | This project is licensed under the MIT License. 54 | -------------------------------------------------------------------------------- /app/(marketing)/layout.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import Link from 'next/link'; 4 | import { CircleIcon } from 'lucide-react'; 5 | 6 | function Header() { 7 | return ( 8 |
9 |
10 | 11 | 12 | CRAZY CODER 13 | 14 |
15 | 20 | Built with ❤️ using Nebius 21 | 22 | 26 | Code 27 | 28 |
29 |
30 |
31 | ); 32 | } 33 | 34 | export default function Layout({ children }: { children: React.ReactNode }) { 35 | return ( 36 |
37 |
38 | {children} 39 |
40 | ); 41 | } 42 | -------------------------------------------------------------------------------- /app/(marketing)/page.tsx: -------------------------------------------------------------------------------- 1 | import { Button } from '@/components/ui/button'; 2 | import { Computer, ArrowRight, FlaskConical, PackageOpen } from 'lucide-react'; 3 | import { Terminal } from './terminal'; 4 | 5 | export default function HomePage() { 6 | return ( 7 |
8 |
9 |
10 |
11 |
12 |

13 | The hottest new programming 14 | language is English 15 |

16 |

17 | Code your program in seconds using powerful open source AI 18 | models. Leverage Qwen, Llama, Mixtral, and more to build your next big idea. 19 |

20 | 30 |
31 |
32 | 33 |
34 |
35 |
36 |
37 | 38 |
39 |
40 |
41 |
42 |
43 | 44 |
45 |
46 |

47 | Ship Faster 48 |

49 |

50 | Code is no longer a barrier to entry. Think, write the pseudo code and let the AI do the rest. 51 |

52 |
53 |
54 | 55 |
56 |
57 | 58 |
59 |
60 |

61 | Leverage Open Source 62 |

63 |

64 | Open source coding models are extremely powerful. Qwen-2.5-Coder-32B for example is on par with GPT-4o. 65 |

66 |
67 |
68 | 69 |
70 |
71 | 72 |
73 |
74 |

75 | Experiment Freely 76 |

77 |

78 | On the Nebius AI Studio, you can experiment with different models at a low cost. 79 |

80 |
81 |
82 |
83 |
84 |
85 | 86 |
87 |
88 |
89 |
90 |

91 | Want to replicate this app? 92 |

93 |

94 | The code is open source and available on GitHub. 95 | You can clone the repository and deploy it to Vercel with ease. 96 |

97 |
98 |
99 | 103 | 107 | 108 |
109 |
110 |
111 |
112 |
113 | ); 114 | } 115 | -------------------------------------------------------------------------------- /app/(marketing)/terminal.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import { useState } from 'react'; 4 | import { Copy, Check } from 'lucide-react'; 5 | import Image from 'next/image'; 6 | 7 | export function Terminal() { 8 | const [copied, setCopied] = useState(false); 9 | 10 | const copyToClipboard = () => { 11 | const terminalSteps = [ 12 | 'import { createOpenAI } from "@ai-sdk/openai";', 13 | 'import { generateText } from "ai";', 14 | 'const openai = createOpenAI({', 15 | ' apiKey: process.env.NEBIUS_API_KEY,', 16 | ' baseURL: process.env.NEBIUS_BASE_URL,', 17 | '});', 18 | 'const model = openai("Qwen/Qwen2.5-Coder-32B-Instruct");', 19 | 'const { text } = await generateText({', 20 | ' model,', 21 | ' prompt: "generate a function that returns future date of birth of AGI",', 22 | '});', 23 | ]; 24 | navigator.clipboard.writeText(terminalSteps.join('\n')); 25 | setCopied(true); 26 | setTimeout(() => setCopied(false), 2000); 27 | }; 28 | 29 | return ( 30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 | 49 |
50 |
51 | Terminal Illustration 59 |
60 |
61 |
62 | ); 63 | } 64 | -------------------------------------------------------------------------------- /app/api/generate-code/route.ts: -------------------------------------------------------------------------------- 1 | import { NextRequest, NextResponse } from 'next/server' 2 | import { createOpenAI } from "@ai-sdk/openai"; 3 | import { generateText } from "ai"; 4 | 5 | const openai = createOpenAI({ 6 | apiKey: process.env.NEBIUS_API_KEY, 7 | baseURL: process.env.NEBIUS_BASE_URL, 8 | }) 9 | 10 | export async function POST(req: NextRequest) { 11 | const { prompt, language, modelName } = await req.json() 12 | 13 | try { 14 | const model = openai(modelName); 15 | 16 | const { text } = await generateText({ 17 | model, 18 | prompt: `Generate ${language} code for the following prompt: ${prompt}.`, 19 | }); 20 | 21 | return NextResponse.json({ code: text }) 22 | } catch (error) { 23 | console.error('Error generating code:', error) 24 | return NextResponse.json({ error: 'Failed to generate code' }, { status: 500 }) 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fsndzomga/crazy-coder/8890b7fa9102e87eb20468be3f4c14946e0994dd/app/favicon.ico -------------------------------------------------------------------------------- /app/fonts/GeistMonoVF.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fsndzomga/crazy-coder/8890b7fa9102e87eb20468be3f4c14946e0994dd/app/fonts/GeistMonoVF.woff -------------------------------------------------------------------------------- /app/fonts/GeistVF.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fsndzomga/crazy-coder/8890b7fa9102e87eb20468be3f4c14946e0994dd/app/fonts/GeistVF.woff -------------------------------------------------------------------------------- /app/generate/page.tsx: -------------------------------------------------------------------------------- 1 | 'use client' 2 | 3 | import { useState } from 'react' 4 | import PromptForm from '@/components/promptForm' 5 | import CodeDisplay from '@/components/codeDisplay' 6 | import { Toaster } from "@/components/ui/toaster" 7 | import { Spinner } from "@/components/spinner" 8 | import Link from 'next/link'; 9 | import { CircleIcon } from 'lucide-react'; 10 | 11 | function Header() { 12 | return ( 13 |
14 |
15 | 16 | 17 | CRAZY CODER 18 | 19 |
20 | 25 | Built with ❤️ using Nebius 26 | 27 | 32 | Follow me 33 | 34 |
35 |
36 |
37 | ); 38 | } 39 | 40 | export default function GeneratePage() { 41 | const [code, setCode] = useState('') 42 | const [isLoading, setIsLoading] = useState(false) 43 | 44 | const handleSubmit = async (prompt: string, language: string, model: string) => { 45 | setIsLoading(true) 46 | try { 47 | const response = await fetch('/api/generate-code', { 48 | method: 'POST', 49 | headers: { 50 | 'Content-Type': 'application/json', 51 | }, 52 | body: JSON.stringify({ prompt, language, modelName: model }), 53 | }) 54 | 55 | if (!response.ok) { 56 | throw new Error('Failed to generate code') 57 | } 58 | 59 | const data = await response.json() 60 | setCode(data.code) 61 | } catch (error) { 62 | console.error('Error generating code:', error) 63 | } finally { 64 | setIsLoading(false) 65 | } 66 | } 67 | 68 | return ( 69 |
70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 | {isLoading ? ( 78 | 79 | ) : ( 80 | 81 | )} 82 |
83 |
84 | 85 |
86 |
87 | ) 88 | } 89 | -------------------------------------------------------------------------------- /app/globals.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | 5 | body { 6 | font-family: Arial, Helvetica, sans-serif; 7 | } 8 | 9 | @layer utilities { 10 | .text-balance { 11 | text-wrap: balance; 12 | } 13 | } 14 | 15 | @layer base { 16 | :root { 17 | --background: 0 0% 100%; 18 | --foreground: 0 0% 3.9%; 19 | --card: 0 0% 100%; 20 | --card-foreground: 0 0% 3.9%; 21 | --popover: 0 0% 100%; 22 | --popover-foreground: 0 0% 3.9%; 23 | --primary: 0 0% 9%; 24 | --primary-foreground: 0 0% 98%; 25 | --secondary: 0 0% 96.1%; 26 | --secondary-foreground: 0 0% 9%; 27 | --muted: 0 0% 96.1%; 28 | --muted-foreground: 0 0% 45.1%; 29 | --accent: 0 0% 96.1%; 30 | --accent-foreground: 0 0% 9%; 31 | --destructive: 0 84.2% 60.2%; 32 | --destructive-foreground: 0 0% 98%; 33 | --border: 0 0% 89.8%; 34 | --input: 0 0% 89.8%; 35 | --ring: 0 0% 3.9%; 36 | --chart-1: 12 76% 61%; 37 | --chart-2: 173 58% 39%; 38 | --chart-3: 197 37% 24%; 39 | --chart-4: 43 74% 66%; 40 | --chart-5: 27 87% 67%; 41 | --radius: 0.5rem; 42 | } 43 | .dark { 44 | --background: 0 0% 3.9%; 45 | --foreground: 0 0% 98%; 46 | --card: 0 0% 3.9%; 47 | --card-foreground: 0 0% 98%; 48 | --popover: 0 0% 3.9%; 49 | --popover-foreground: 0 0% 98%; 50 | --primary: 0 0% 98%; 51 | --primary-foreground: 0 0% 9%; 52 | --secondary: 0 0% 14.9%; 53 | --secondary-foreground: 0 0% 98%; 54 | --muted: 0 0% 14.9%; 55 | --muted-foreground: 0 0% 63.9%; 56 | --accent: 0 0% 14.9%; 57 | --accent-foreground: 0 0% 98%; 58 | --destructive: 0 62.8% 30.6%; 59 | --destructive-foreground: 0 0% 98%; 60 | --border: 0 0% 14.9%; 61 | --input: 0 0% 14.9%; 62 | --ring: 0 0% 83.1%; 63 | --chart-1: 220 70% 50%; 64 | --chart-2: 160 60% 45%; 65 | --chart-3: 30 80% 55%; 66 | --chart-4: 280 65% 60%; 67 | --chart-5: 340 75% 55%; 68 | } 69 | } 70 | 71 | @layer base { 72 | * { 73 | @apply border-border; 74 | } 75 | body { 76 | @apply bg-background text-foreground; 77 | } 78 | } 79 | -------------------------------------------------------------------------------- /app/layout.tsx: -------------------------------------------------------------------------------- 1 | import './globals.css'; 2 | import type { Metadata, Viewport } from 'next'; 3 | import { Manrope } from 'next/font/google'; 4 | import { Analytics } from "@vercel/analytics/react" 5 | 6 | export const metadata: Metadata = { 7 | title: 'Crazy Coder', 8 | description: 'An AI Coder Powered by Powerful Open Source Models', 9 | metadataBase: new URL('https://code.lycee.ai'), 10 | }; 11 | 12 | export const viewport: Viewport = { 13 | maximumScale: 1, 14 | }; 15 | 16 | const manrope = Manrope({ subsets: ['latin'] }); 17 | 18 | export default function RootLayout({ 19 | children, 20 | }: { 21 | children: React.ReactNode; 22 | }) { 23 | 24 | return ( 25 | 29 | 30 | {children} 31 | 32 | 33 | 34 | ); 35 | } 36 | -------------------------------------------------------------------------------- /app/opengraph-image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fsndzomga/crazy-coder/8890b7fa9102e87eb20468be3f4c14946e0994dd/app/opengraph-image.png -------------------------------------------------------------------------------- /components.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://ui.shadcn.com/schema.json", 3 | "style": "new-york", 4 | "rsc": true, 5 | "tsx": true, 6 | "tailwind": { 7 | "config": "tailwind.config.ts", 8 | "css": "app/globals.css", 9 | "baseColor": "neutral", 10 | "cssVariables": true, 11 | "prefix": "" 12 | }, 13 | "aliases": { 14 | "components": "@/components", 15 | "utils": "@/lib/utils", 16 | "ui": "@/components/ui", 17 | "lib": "@/lib", 18 | "hooks": "@/hooks" 19 | }, 20 | "iconLibrary": "lucide" 21 | } -------------------------------------------------------------------------------- /components/codeDisplay.tsx: -------------------------------------------------------------------------------- 1 | 'use client' 2 | 3 | import ReactMarkdown from 'react-markdown' 4 | import rehypeRaw from 'rehype-raw' 5 | import remarkGfm from 'remark-gfm' 6 | import { ScrollArea } from "@/components/ui/scroll-area" 7 | 8 | interface CodeDisplayProps { 9 | code: string 10 | } 11 | 12 | export default function CodeDisplay({ code }: CodeDisplayProps) { 13 | return ( 14 | 15 |
16 | 24 | 25 | {children} 26 | 27 | 28 | ) : ( 29 | 30 | {children} 31 | 32 | ) 33 | }, 34 | }} 35 | > 36 | {code} 37 | 38 |
39 | 40 | ) 41 | } 42 | -------------------------------------------------------------------------------- /components/promptForm.tsx: -------------------------------------------------------------------------------- 1 | 'use client' 2 | 3 | import { useState } from 'react' 4 | import { Button } from "@/components/ui/button" 5 | import { Textarea } from "@/components/ui/textarea" 6 | import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" 7 | import { useToast } from "@/hooks/use-toast" 8 | 9 | const languages = [ 10 | 'Python', 11 | 'JavaScript', 12 | 'TypeScript', 13 | 'C', 14 | 'C++', 15 | 'Java', 16 | 'Go', 17 | 'Ruby', 18 | 'VBA', 19 | 'DAX', 20 | 'PowerShell' 21 | ]; 22 | 23 | 24 | const models = [ 25 | 26 | 'Qwen/Qwen2.5-Coder-32B-Instruct', 27 | 'Qwen/Qwen2.5-72B-Instruct', 28 | 'meta-llama/Meta-Llama-3.1-405B-Instruct', 29 | 'deepseek-ai/DeepSeek-Coder-V2-Lite-Instruct', 30 | 'meta-llama/Meta-Llama-3.1-70B-Instruct', 31 | 'Qwen/Qwen2.5-Coder-7B', 32 | ] 33 | 34 | interface PromptFormProps { 35 | onSubmit: (prompt: string, language: string, model: string) => Promise 36 | isLoading: boolean 37 | } 38 | 39 | export default function PromptForm({ onSubmit, isLoading }: PromptFormProps) { 40 | const [prompt, setPrompt] = useState('') 41 | const [language, setLanguage] = useState(languages[0]) 42 | const [model, setModel] = useState(models[0]) 43 | const { toast } = useToast() 44 | 45 | const handleSubmit = async (e: React.FormEvent) => { 46 | e.preventDefault() 47 | if (!prompt) { 48 | toast({ 49 | title: "Error", 50 | description: "Please enter a prompt.", 51 | variant: "destructive", 52 | }) 53 | return 54 | } 55 | try { 56 | await onSubmit(prompt, language, model) 57 | } catch (error) { 58 | console.error('Error generating code:', error) 59 | toast({ 60 | title: "Error", 61 | description: "Failed to generate code. Please try again.", 62 | variant: "destructive", 63 | }) 64 | } 65 | } 66 | 67 | return ( 68 |
69 |