Content
<div align="center">
<h1>🚀 AI Code Tutorials</h1>
<h3><em>Claude Code and OpenAI Codex AI-Assisted Programming Tutorials</em></h3>
</div>
<p align="center">
<strong>Learn AI-assisted programming with Claude Code and OpenAI Codex, from beginner to advanced levels.</strong>
</p>
<p align="center">
<a href="https://github.com/0xfnzero/AI-Code-Tutorials">
<img src="https://img.shields.io/github/stars/0xfnzero/AI-Code-Tutorials?style=social" alt="GitHub stars">
</a>
<a href="https://github.com/0xfnzero/AI-Code-Tutorials/network">
<img src="https://img.shields.io/github/forks/0xfnzero/AI-Code-Tutorials?style=social" alt="GitHub forks">
</a>
<a href="https://github.com/0xfnzero/AI-Code-Tutorials/blob/main/LICENSE">
<img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="License">
</a>
<a href="https://github.com/0xfnzero/AI-Code-Tutorials/issues">
<img src="https://img.shields.io/github/issues/0xfnzero/AI-Code-Tutorials" alt="GitHub issues">
</a>
</p>
<p align="center">
<img src="https://img.shields.io/badge/Claude-000000?style=for-the-badge&logo=anthropic&logoColor=white" alt="Claude">
<img src="https://img.shields.io/badge/Codex-111827?style=for-the-badge&logo=openai&logoColor=white" alt="Codex">
<img src="https://img.shields.io/badge/AI-FF6B6B?style=for-the-badge&logo=openai&logoColor=white" alt="AI">
<img src="https://img.shields.io/badge/Tutorial-4B8BBE?style=for-the-badge&logo=read-the-docs&logoColor=white" alt="Tutorial">
</p>
<p align="center">
<a href="#-tutorial-outline">Tutorial Outline</a> •
<a href="#-learning-path">Learning Path</a> •
<a href="#-learning-objectives">Learning Objectives</a> •
<a href="#-additional-resources">Resources</a>
</p>
<p align="center">
<a href="https://github.com/0xfnzero/AI-Code-Tutorials/blob/main/README_EN.md">English</a> |
<a href="https://fnzero.dev/">Website</a> |
<a href="https://t.me/fnzero_group">Telegram</a> |
<a href="https://discord.gg/vuazbGkqQE">Discord</a>
</p>
---
## 🔎 What This Tutorial Covers
AI-Code-Tutorials is a bilingual AI-assisted programming tutorial series, targeting beginners, independent developers, and professional engineers. Current content covers Claude Code and OpenAI Codex, from installation and configuration to advanced AI-assisted programming workflows.
| Module | Covered Content |
|------|----------|
| Basics | Claude Code and Codex concepts, installation, configuration, first conversation, CLI commands, file operations |
| Project Practice | Web application planning, frontend pages, backend API, user authentication, functional enhancements, deployment |
| Advanced Workflow | Prompt engineering, code review, debugging techniques, design patterns, error handling, security practices |
| AI Agent | Sub-agent concepts, development/architecture/testing/operations agents, collaboration modes, MCP server configuration |
| Codex Specialized | Codex CLI, App, IDE, Cloud, GitHub review, AGENTS.md, sandbox, skills, plugins |
| Continuous Updates | Claude Code, OpenAI Codex, MCP, Skills, Agent SDK, AI programming trend tracking and tutorial maintenance |
## 📖 Quick Start
If you primarily use Claude Code, start with [Lesson 1: What is Claude Code?](./tutorials/01-foundation.md).
If you primarily use OpenAI Codex, read [Lesson 16: OpenAI Codex Introduction and Practice](./tutorials/16-OpenAI-Codex-Introduction-and-Practice.md) and return to Lessons 6, 7, 9, 12, and 13.
> 📌 **Maintenance Status**: This repository has been under continuous updates since 2026-06-20. For version-related content, please refer to [Lesson 15: AI Programming Development Tracking and Continuous Iteration Manual](./tutorials/15-AI-Programming-Development-Tracking.md) and [Changelog](./CHANGELOG.md).
## 🎯 Tutorial Outline
This tutorial adopts a progressive approach, divided into three stages: beginner, intermediate, and advanced. **Even if you have no prior programming experience, you can follow along!**
### 📘 Beginner (Friendly for Zero Foundation)
#### [Lesson 1: What is Claude Code?](./tutorials/01-foundation.md)
- Claude Code introduction
- Differences from ChatGPT
- Capabilities and suitability
#### [Lesson 2: Installation and Configuration](./tutorials/02-installation-and-configuration.md)
- Node.js installation
- Claude Code installation
- API key acquisition and configuration
- First run and common issues
#### [Lesson 3: First Conversation](./tutorials/03-first-conversation.md)
- Effective communication
- First project creation (personal name card webpage)
- Understanding Claude Code's workflow
- Common interaction scenarios and practical conversation templates
#### [Lesson 4: Basic Commands and Operations](./tutorials/04-basic-commands-and-operations.md)
- Built-in command explanations
- File operation techniques
- Project management methods
- Code search and navigation
- Git basic operations
### 📗 Intermediate
#### [Lesson 5: Advanced File Operations](./tutorials/05-advanced-file-operations.md)
- Complex project structure management
- Cross-file search and replacement
- Code refactoring techniques
- Batch file operations
- Configuration file management
- Automated project documentation
#### [Lesson 6: Project Practice - Complete Web Application](./tutorials/06-project-practice-web-application.md)
- Task management application construction, including 8 detailed modules:
- [1.1 Project Planning](./tutorials/06-project-practice-web-application/01-project-planning.md) - Requirements analysis, technology stack selection
- [1.2 Project Structure Setup](./tutorials/06-project-practice-web-application/02-project-structure.md) - Directory structure, version control
- [1.3 Static Page Design](./tutorials/06-project-practice-web-application/03-static-page.md) - HTML/CSS, responsive layout
- [1.4 Frontend Function Implementation](./tutorials/06-project-practice-web-application/04-frontend-function.md) - CRUD operations, local storage
- [1.5 Backend Server Setup](./tutorials/06-project-practice-web-application/05-backend-setup.md) - Express, SQLite, API
- [1.6 User Authentication System](./tutorials/06-project-practice-web-application/06-user-authentication.md) - Registration login, JWT, password encryption
- [1.7 Functional Enhancements](./tutorials/06-project-practice-web-application/07-functional-enhancements.md) - Search filtering, drag-and-drop sorting
- [1.8 Deployment and Launch](./tutorials/06-project-practice-web-application/08-deployment-and-launch.md) - Heroku deployment, environment configuration
#### [Lesson 7: Advanced Techniques and Best Practices](./tutorials/07-advanced-techniques.md)
- Master advanced development techniques, including 6 specialized modules:
- [1.1 Prompt Basics](./tutorials/07-advanced-techniques/01-prompt-basics.md) - Specific description, structured context, example reference
- [1.2 Code Review](./tutorials/07-advanced-techniques/02-code-review.md) - Performance optimization, refactoring suggestions
- [1.3 Debugging Techniques](./tutorials/07-advanced-techniques/03-debugging-techniques.md) - Systematic debugging, breakpoints, logs
- [1.4 Design Patterns](./tutorials/07-advanced-techniques/04-design-patterns.md) - Singleton, observer, factory patterns
- [1.5 Error Handling](./tutorials/07-advanced-techniques/05-error-handling.md) - Unified handling, friendly prompts
- [1.6 Security Best Practices](./tutorials/07-advanced-techniques/06-security-practices.md) - Input validation, XSS/CSRF protection
### 📕 Advanced
#### [Lesson 8: Claude Code Advanced Applications](./tutorials/08-advanced-applications.md)
- AI pair programming
- Complex project architecture design
- Micro-frontend architecture
- Plugin system design
- Automated testing (unit testing, E2E testing)
- CI/CD integration
- Multi-language project development
#### [Lesson 9: Prompt Optimization Techniques](./tutorials/09-prompt-optimization-techniques.md) ⭐
- **Secrets to 10x efficiency improvement**, including 6 core modules:
- [1.1 Six Golden Principles](./tutorials/09-prompt-optimization-techniques/01-six-principles.md) - Specific, structured, rich context
- [1.2 Advanced Techniques](./tutorials/09-prompt-optimization-techniques/02-advanced-techniques.md) - Role setting, thought chain, constrained prompts
- [1.3 Template Library](./tutorials/09-prompt-optimization-techniques/03-template-library.md) - Functional development, code review, bug fixing
- [1.4 Best Practices](./tutorials/09-prompt-optimization-techniques/04-best-practices.md) - Dos/Don'ts, common pitfalls
- [1.5 Case Studies](./tutorials/09-prompt-optimization-techniques/05-case-studies.md) - Real projects, before-and-after comparisons
- [1.6 Practice Projects](./tutorials/09-prompt-optimization-techniques/06-practice-projects.md) - Prompt rewriting, practical exercises
#### [Lesson 10: AI Sub-Agent System](./tutorials/10-ai-sub-agent-system.md) ⭐
- **Building your expert team**, including 7 specialized modules:
- [1.1 Core Concepts](./tutorials/10-ai-sub-agent-system/01-core-concepts.md) - What are sub-agents, advantages, classification
- [1.2 Development Agents](./tutorials/10-ai-sub-agent-system/02-development-agents.md) - Frontend, backend, full-stack experts
- [1.3 Architecture Agents](./tutorials/10-ai-sub-agent-system/03-architecture-agents.md) - System, data, infrastructure architects
- [1.4 Testing Agents](./tutorials/10-ai-sub-agent-system/04-testing-agents.md) - Test engineers, QA, performance testing
- [1.5 Operations Agents](./tutorials/10-ai-sub-agent-system/05-operations-agents.md) - CI/CD, container, monitoring experts
- [1.6 Collaboration Modes](./tutorials/10-ai-sub-agent-system/06-collaboration-modes.md) - Single agent, serial, parallel, review
- [1.7 Practical Projects](./tutorials/10-ai-sub-agent-system/07-practical-projects.md) - Complete project development case
## 🎓 Learning Path Suggestions
### Beginners
```
Lesson 1 → Lesson 2 → Lesson 3 → Lesson 4 → Lesson 6 (Practice)
Expected learning time: 2-3 weeks
```
### Users with Prior Programming Experience
```
Lesson 1 (quick review) → Lesson 2 → Lesson 4 → Lesson 5 → Lesson 6 → Lesson 7 → Lesson 9 → Lesson 10 → Lesson 16
Expected learning time: 1-2 weeks
```
### Professional Developers
```
Lesson 2 (installation) → Lesson 5 → Lesson 7 → Lesson 9 (must-learn) → Lesson 10 (must-learn) → Lesson 13 (MCP) → Lesson 15 (continuous tracking) → Lesson 16 (Codex)
Expected learning time: 3-5 days
```
### Codex Users
```
Lesson 16 (Codex) → Lesson 13 (MCP) → Lesson 15 (continuous tracking) → Lesson 7 (advanced techniques) → Lesson 9 (prompt optimization) → Lesson 10 (AI Agent)
Expected learning time: 3-5 days
```
## 💡 Learning Suggestions
1. **Learn in sequence** - Later lessons rely on earlier knowledge.
2. **Practice hands-on** - Each lesson has practice tasks; do them yourself.
3. **Don't skip** - Even if you find some lessons simple, go through them.
4. **Ask questions** - If unsure, directly ask Claude Code.
5. **Take notes** - Record commonly used commands and techniques.
6. **Create projects** - After each stage, do a small project to consolidate learning.
## 🎯 Learning Objectives
After completing this tutorial, you will be able to:
- ✅ Proficiently use Claude Code for daily development
- ✅ Familiar with OpenAI Codex CLI, App, IDE, Cloud, and GitHub review workflows
- ✅ Independently complete frontend and backend projects
- ✅ Apply best practices to write high-quality code
- ✅ Design and implement complex application architectures
- ✅ Establish complete development workflows
- ✅ Keep up with AI programming tool changes and regularly update team practices
- ✅ Use AI to improve development efficiency by 10x
## 🔄 Continuous Update Mechanism
AI programming tools are rapidly evolving. This repository will be maintained through:
- Monthly checks on Claude Code, OpenAI Codex, MCP, Skills, and Agent SDK official documentation and version changes.
- Quarterly reviews of commands, configurations, model names, deployment platforms, and security suggestions in the tutorial.
- All version-related updates recorded in [CHANGELOG.md](./CHANGELOG.md).
- Specific checklists in [Lesson 15](./tutorials/15-AI-Programming-Development-Tracking.md).
## 📚 Additional Resources
### Official Documentation
#### Claude Code
- [Claude Code Documentation](https://docs.anthropic.com/en/docs/claude-code/overview)
- [Claude Code Changelog](https://code.claude.com/docs/en/changelog)
#### OpenAI Codex
- [OpenAI Codex Overview](https://developers.openai.com/codex)
- [OpenAI Codex Manual](https://developers.openai.com/codex/codex-manual.md)
#### General Protocols and Ecosystem
- [Model Context Protocol](https://modelcontextprotocol.io/docs/getting-started/intro)
- [Agent Skills](https://agentskills.io)
### Recommended Articles
#### 1. Claude Code Optimization Guide
Don't write prompts blindly! This Claude Code optimization guide improves your efficiency by 10x.
🔗 [View Article](https://juejin.cn/post/7539544124669870115)
#### 2. Claude Code AI Sub-Agent Collection
A comprehensive collection of 83 professional AI sub-agents covering software development, infrastructure, and business operations.
🔗 [GitHub Repository](https://github.com/wshobson/agents)
#### 3. AI Workflow Practice
Spent 1 year finally having my own AI workflow.
🔗 [View Article](https://aicoding.juejin.cn/post/7551359585900331060)
#### 4. AI Programming Export Practice
AI programming export practice guide.
🔗 [View Article](https://aicoding.juejin.cn/post/7553598949196021812)
## 🚀 Start Learning
Based on the tools you use:
- Claude Code users: [Lesson 1: What is Claude Code?](./tutorials/01-foundation.md)
- OpenAI Codex users: [Lesson 16: OpenAI Codex Introduction and Practice](./tutorials/16-OpenAI-Codex-Introduction-and-Practice.md)
## 📞 Get Help
- 💬 Encounter issues? Directly ask your AI coding agent.
- 🐛 Found errors? Submit an issue.
- 💡 Have suggestions? Welcome to Pull Request.
## 📄 License
This tutorial follows the MIT License, and welcome to use and share freely.
⭐ If this tutorial helps you, give it a Star!
Connection Info
You Might Also Like
No recommendations available