Full Stack Development

The AI Revolution in Full-Stack Development

by Tomas Trescak t.trescak@westernsydney.edu.au

React Fundamentals

AI Revolution

  • AI is transforming full-stack development
  • But developers are still essential!
  • Understanding full-stack systems is critical
  • AI ≠ perfect code

React Fundamentals

How AI Can Build Full-Stack Systems

  • AI tools can generate frontend & backend code
  • Optimizes database queries
  • Configures CI/CD pipelines
    // AI-generated React component
function CreditPayment() {
  return <>
    Credit Card Payment Info:
    <input placeholder="Card Number" />
    <input placeholder="Expiry" />
    <input placeholder="CVC" />
  </>;
}
  

React Fundamentals

AI Struggles in Full-Stack Development

  • Security vulnerabilities
  • Lack of scalability
  • No business logic awareness
    app.post("/login", (req, res) => {
    const { username, password } = req.body;
    if (username === "admin" && password === "password") {
        res.send("Logged in!");
    }
});
  

Developer Experience

  • 1000 hours with Cursor AI
  • Senior Developer
1. The first generated output often contains bugs that could cost you a ton of time and money

As a result, a lot of time can be wasted reviewing and refactoring Al generated code.

Developer Experience

2. Inconsistent quality of outputs

If you provide the same prompt several times to the chatbot, you may end up with drastically different solutions to the problem.

In addition, if you ask the Al any questions that contain suggestions or alternative solutions, it will apologize and refactor the entire code again.

Developer Experience

3. AI can significantly increase technical debt

Even when the Al generates a "good" code block solution, it doesn't consider the entire software design and architecture of the application.

Due to the lack of a holistic perspective, problems emerge includes inconsistent error handling, modularity, and data modelling across the app.

Developer Experience

AI only as autocompletion helper

Cursor Al (or Al coding in general) is a useful autocompletion tool that can boost your development productivity, but in the long run, it can waste significant time and energy.

If however, you simply "trust" the Al outputs due to lack of knowledge, skill, or willingness to review results, the long term damage will outweigh the initial productivity gains you got so "hyped" about.

React Fundamentals

The Importance of Human Developers

  • Security Audits
  • Business Logic Implementation
  • Debugging & Optimization

React Fundamentals

AI Tools

Tool Use Case Limitations
GitHub Copilot Assists with code suggestions Can generate insecure or inefficient code
ChatGPT Generates APIs & frontend code Lacks deep understanding of business needs
Amazon Q Developer Helps in cloud-based development Needs human oversight for optimizations
v0.dev (Vercel) Generates UI from text prompts Requires manual refinement, often unpolished
bolt.new Browser-based full-stack development Limited UI customization, sluggish performance
Cursor AI-powered code editor Struggles with large projects, performance issues

AI Revolution

Video Reflection

AI Revolution

Conclusions

  • AI accelerates development but needs human oversight
  • AI-generated code must be reviewed & refined
  • Future of full-stack development