Latest Twitter Threads by @cj_zZZz on Thread Reader App

Mar 23 • 10 tweets • 3 min read

This is "Glass Morphism" style.

I coded this interface in 10 minutes (one-shot), using:
- @CodeGuidedev (to generate coding docs)
- @v0 (to code the UI component)

Here's how you can design clean UI components: ↓

Design should be the most important factor of your app.

End user care about the experience. "First impression is the last impression"

Present you app in clean, modern and vibrant layout.

Step 1: Describe your idea and generate coding docs.

Mar 22 • 9 tweets • 3 min read

How to make Cursor Agent super powerful?

A complete guide: ↓

In future Cursor Agent will be able to run for hours and code the complete app autonomously.

We can see glimpses of this right now.

But there's a core issue, AI hallucinations!

AI models can make up things, hallucinate and start breaking the codebase.

We can't afford this.

Mar 21 • 12 tweets • 3 min read

After coding 36 app with AI models, I've compiled a security checklist that you can follow.

Trick: Paste this into AI coding tools (Cursor/Windsurf) and ask them to generate a security report.

Then fix all errors before launch.

BOOKMARK this: ↓

This happened recently!

Let's fix it for others.

Mar 18 • 11 tweets • 4 min read

I code with AI tools for 6-7 hours daily.

Built over 36 projects in last 12 months.

Truth: "Build me ........... app" in 1 prompt is not possible.

So, here're all the MISTAKES you might be making with AI code:

1. No Planning.

I go from idea to a well written draft for my MVP in few hours with my planning hack.

I just turn on ChatGPT voice and we have one-on-one conversation about what do I want.

15 minute chat then I ask: "write me a well structured draft on all the tings we've finalized in this conversation"

I use ChatGPT voice as my brainstorm buddy, critique, web researcher and then draft writer.

In the end I get the core features of this MVP on one page.

Don't build blindly. Plan before you hunt.

Mar 16 • 8 tweets • 3 min read

Do you want to use Cursor/windsurf for your existing Github projects?

Here's how you can make (existing or new) GitHub repo AI native.
↓

Cursor Agent/ Windsurf Cascade can overwrite code, delete files or duplicate existing files.

This can mess up the entire project and debugging on a large codebase can get messy.

So for existing codebases sitting on GitHub that's a huge risk.

Let's fix this core issue:

Mar 13 • 10 tweets • 4 min read

I am not a UI designer.

But with CodeGuide + Claude + v0 I've cracked the UI design workflow.

This design is purely coded with AI in 13 minutes.

Let me explain my NEW UI design workflow: ↓

First of all If you haven't read my last post on this topic,

Please read that so you can understand the basics: ↓

https://x.com/cj_zZZz/status/1899491125486116937

Mar 11 • 10 tweets • 4 min read

I built this UI design with v0 and Claude·ai (web app)

It took me 25 minutes to code this interface.

Let me share my new UI design workflow: ↓

Before we start here're few other pages of same web app:

- Sign up page
- Sign in page

You can see the style consistency.

Mar 10 • 8 tweets • 3 min read

Cursor/Windsurf technique to remove 80% hallucinations.

Stop AI to think and plan. Attach 'coding documents' and force AI to use it as a knowledge base.

If you code with AI, read this: ↓

When we let AI plan on it own, AI messes up the codebase.

Top AI coding models (Claude 3.5/3.7 Sonnet, GPt4o) are predictive models.

They can follow the the instructions and go from point A to point B.

But they are not good think, plan and map out next steps.

We can fix this.

Mar 9 • 10 tweets • 3 min read

I built this Interface entirely with AI in 47 minutes.

(without writing a single line of code)

I used 2 tools:
1. Claude AI (web app)
2. Cursor AI

Here's a step-by-step guide on how I built this app:

1. Write a detailed Project Documentation

If you want:
- consistent design
- high quality code
- less hallucinations

you need to write "project coding documents" to provide context to AI.

I use @CodeGuidedev to write docs, that includes:
- PRD
- app flow doc
- frontend guidelines
- backend structure
etc.

Mar 5 • 12 tweets • 4 min read

How I made my Cursor/Windsurf workflow ultra productive with "Context Boundary" Technique:

(Bookmark this for future reference) ↓

Even the Founder of @cursor_ai acknowledged that.

Let's dive into it:

Mar 1 • 9 tweets • 3 min read

New Cursor Coding Workflow: 🧵
(Bookmark this for future reference)

1. Unified Interface: Agent as Default Mode

The previous 'Chat' and 'Composer' tabs are replaced with a simpler dropdown menu:

1. 'Agent' mode is now the default mode
2. Use 'Edit' mode for precise changes
3. Use 'Ask' for planning and questions

It's much better UI/UX now.

Feb 23 • 8 tweets • 3 min read

Cursor/Windsurf has 3 major issues:

1. AI hallucinations
2. Loop of errors
3. Context awareness

To fix these core issues we need to build a strong {Context Boundary} around AI.

Here's how you can fix your AI coding workflow : 🧵

Cursor and Windsurf built around predictive models like Claude Sonnet 3.5 and GPT4o.

These models can only think about 1 possibility and that 1 possible step can be wrong 9/10 times.

We need to make sure that we don't let these models predict their next steps.

Feb 20 • 9 tweets • 4 min read

Cursor/Windsurf cheat code.

{Provide detailed context about your coding project}

It will minimize 85% of AI hallucinations and errors.

Here's how you can do it using ChatGPT:

1. Project Requirements Document.

Ask AI to write a PRD (for AI coding model) about your project.

It should include these sections.
- App overview
- User flow
- Tech stack & APIs
- Core features
- In-scope and out-of-scope

To make it air tight add these too:
- Non-functional requirements
- Constraints & assumptions
- Known issues & potential pitfalls

This doc will provide high level overview to Cursor/Windsurf

Feb 19 • 14 tweets • 3 min read

English language as a coding language now

Thanks to AI code.

There are 5 steps in AI coding:
- plan
- prompt
- scaffold
- debug
- deploy

You don't need to be a technical developer to code with AI.

Here's your Zero-to-Hero Guide on AI coding.

AI coding works with 2 main engines.

AI coding LLM models + AI tools

Top AI Coding Models:
1. Claude Sonnet 3.5
2. GPT o1
3. GPT o3-mini
4. Deepseek r1

Top AI Coding Tools:
1. Cursor
2. Windsurf
3. Bolt
4. Replit
5. Lovable
6. Cline

I'll unpack below:

Feb 10 • 9 tweets • 4 min read

Cursor is the Best AI coding IDE.

Let's build an AI app that can clone tweet style and mimic future tweets: 🧵

1. Clone CodeGuide Starter Kit (Open Source or PRO)

- go to Github page of @CodeGuidedev Starter Kits
- click on 'use this template'
- then create new repository
- now name your new repo
- make it private
- then "create Repository"
- Click on "code"
- copy the link

Feb 9 • 5 tweets • 2 min read

If you use @boltdotnew let me save you alot of tokens.

Here's how:

Step 1: Install CodeGuide NextJS Starter Kit with pre-installed packages

- NextJS 14 (ideal for AI tools)
- Typescript
- TailwindCSS
- Shadcn UI
- Supabase
- ClerkDev

Step 2: Attach your project documentation

For Bolt we need 2 documents:
1. project requirements doc. (PRD)
2. app flow doc.

- Go to @CodeGuidedev Dashboard
- Go to New Project
- Complete 5 steps
- Click "Download all"
- Unzip docs on computer
- Upload PRD + app flow doc

Feb 5 • 14 tweets • 5 min read

Windsurf might take over Cursor AI in few months.

Designed to be simple and intuitive—ideal for beginners.

I'd rate Windsurf 7.5/10 and Cursor 8/10, so margins are very bleak.

But it is getting better with each new update.

Here's how you can use Windsurf to build your first SaaS:

1. You need to Generate PCD {Project Coding Docs}

This step is vital, you need to provide deep context about your project.

What is your app about?
Tech stack?
App flow?
Backend?
APIs used?
etc

If you don't build a context boundary around AI models, it messes up your codebase

Feb 4 • 9 tweets • 3 min read

I've coded 33 projects in last 5 moths.

without writing a single line of code.

I am about to share my AI coding workflow with you for FREE: 🧵

(Bookmark this for future use) 1st thing: Understand what is AI coding.

2024 has blessed us with powerful AI coding model like Claude Sonnet 3.5.

This model enabled anyone with computer skills to code software without writing a single line of code.

Feb 2 • 6 tweets • 3 min read

Introducing @CodeGuidedev NextJS Starter Kits

The First Ever Starter Kit built for AI Coding Models.
- o3-mini
- Claude Sonnet 3.5
- GPT4o

Today we're launching 2 Starter Kits:
1. CodeGuide Starter Kit Lite (Open-Source)
2. CodeGuide Starter Kit Pro (Commercial Licence)

Read: 👇

Goal:

To design a Boilerplate for AI Coding Models to work effectively with less Errors and Hallucinations.

We chose NextJS as its the most reliable full-stack framework with all coding models. Also it is fast and scalable.

Build websites to Complex Web apps with NextJS.

Jan 30 • 11 tweets • 3 min read

Interesting!
More Open Source Models are released from China.

→ Kimi k1.5 (multimodal reasoning model)
→ Qwen 2.5 Max (1M context window)
→ Mistral Small 3 (24B model)

Let's explore all these models below:
🧵

1. Kimi k1.5

Official Tweet by Kimi Account

https://x.com/Kimi_Moonshot/status/1881332472748851259

Jan 25 • 14 tweets • 4 min read

Turn any AI Model into Reasoning Model with Deepseek r1 <thinking> Architecture.

Models like GPT4o and Sonnet 3.5 are Implementation Models

But a new breakthrough with Deepseek can make them a Reasoning model.

Here's a step-by-step Explanation:
🧵

Deepseek r1 is an open source AI model competing against o1 model of OpenAI.

Which is the Top-Notch Reasoning Model.

How Reasoning Models work?
User message → Chain of Thought steps → Output

The CoT step is the main difference right now between r1 and o1

Share this page!

Enter URL or ID to Unroll