𝗧𝗵𝗲 𝗧𝗲𝗰𝗵 𝗦𝘁𝗮𝗰𝗸 𝗳𝗼𝗿 𝗔𝗜 𝗡𝗮𝘁𝗶𝘃𝗲 𝗪𝗲𝗯 𝗗𝗲𝘃𝗲𝗹𝗼𝗽𝗺𝗲𝗻𝘁

AI-Native వెబ్ డెవలప్‌మెంట్ కోసం టెక్-స్టాక్

Claude Code వంటి AI ఏజెంట్లు మీరు సాఫ్ట్‌వేర్‌ను నిర్మించే విధానాన్ని మారుస్తాయి. మీరు మునుపటి కంటే వేగంగా ముందుకు వెళ్లగలరు. కానీ, ఆ వేగం వల్ల కోడ్ గందరగోళంగా మారే అవకాశం ఉంది. మీ ప్రాజెక్ట్ వృద్ధి చెందాలంటే, దానిని సరళంగా మరియు సులభంగా నిర్వహించగలిగేలా (maintainable) ఉంచుకోవాలి.

వేగంగా నిర్మించడానికి మరియు సులభంగా స్కేల్ చేయడానికి మేము ఉపయోగించే స్టాక్ ఇక్కడ ఉంది.

AI ఏజెంట్ వ్యూహం ఓవర్ ఇంజనీరింగ్ చేయకండి. AI ద్వారా వేల సంఖ్యలో అనవసరమైన కోడ్ లైన్లను జోడించడం చాలా సులభం అవుతుంది.

• మీ AGENTS.md లేదా CLAUDE.md ఫైళ్లను చిన్నవిగా ఉంచండి.
• ఏజెంట్లు తరచుగా తప్పు చేసే ప్రాజెక్ట్ నియమాలను మాత్రమే చేర్చండి.
• మీకు అవసరమైనప్పుడు మాత్రమే నిర్దిష్ట స్కిల్స్‌ను ఇన్‌స్టాల్ చేయండి.
• కాంటెక్స్ట్ క్లీన్‌గా ఉండటానికి, సంభాషణ ముగిసిన తర్వాత స్కిల్స్‌ను తొలగించండి.

ఫ్రంటెండ్ మరియు UI

• Next.js: App Routerని ఉపయోగించండి. ఇది మెరుగైన SEO మరియు వేగం కోసం సర్వర్-సైడ్ రెండరింగ్‌ను నిర్వహిస్తుంది.
• React: ఫీచర్లను వేగంగా జోడించడానికి ఇది ఉత్తమమైన ఎకోసిస్టమ్.
• MUI (Material UI): Figmaలో ప్రతిదీ మొదటి నుండి డిజైన్ చేయకుండా ఉండటానికి మేము దీనిని ఉపయోగిస్తాము. ఇది నెలల కొద్దీ పనిని ఆదా చేస్తుంది.
• Zod మరియు React Hook Form: సంక్లిష్టమైన ఫారమ్‌లు మరియు వాలిడేషన్‌ను నిర్వహించడానికి ఇవి ఉత్తమమైన కాంబినేషన్.

బ్యాకెండ్ మరియు డేటా

• Firebase: అథెంటికేషన్, స్టోరేజ్ మరియు డేటాబేస్ (Firestore) కోసం మేము దీనిని ఉపయోగిస్తాము.
• Firestore Rules: ఇది అన్ని పర్మిషన్లను ఒకే ఫైల్‌లో నిర్వహిస్తుంది. దీనివల్ల పదేపదే సెక్యూరిటీ కోడ్ రాయాల్సిన అవసరం ఉండదు.
• Firebase Functions: సంక్లిష్టమైన లాజిక్ కోసం వీటిని ఉపయోగించండి. మీ ఫ్రంటెండ్‌ను సింపుల్‌గా మరియు బ్యాకెండ్‌ను స్మార్ట్‌గా ఉంచండి.
• Vercel AI SDK: మీ యాప్‌లోకి వివిధ AI మోడళ్లను అనుసంధానించడానికి ఇది అత్యంత సులభమైన మార్గం.

టెస్టింగ్ మరియు డిప్లాయ్‌మెంట్

• Integration Tests: బ్యాకెండ్ సర్వీస్ లేయర్‌ను పరీక్షించడానికి మేము Jestని ఉపయోగిస్తాము. చిన్న యూనిట్ టెస్ట్‌ల కంటే, వివిధ భాగాలు కలిసి ఎలా పనిచేస్తాయనే దానిపై మేము దృష్టి పెడతాము.
• TypeScript: సురక్షితమైన రిఫ్యాక్టరింగ్ కోసం ఇది చాలా అవసరం.
• Vercel: ఇది ఇన్‌స్టంట్ ప్రొడక్షన్ మరియు ప్రివ్యూ డిప్లాయ్‌మెంట్‌లను అందించడానికి GitHubతో కనెక్ట్ అవుతుంది.
• PostHog: అనలిటిక్స్, సెషన్ రీప్లేలు మరియు ఎర్రర్ లాగ్‌ల కోసం దీనిని ఉపయోగించండి.
• Resend మరియు react-email: ఇది మీరు ఈమెయిల్‌లను React కాంపోనెంట్‌లుగా వ్రాయడానికి అనుమతిస్తుంది.

ఈ స్ట్రక్చర్‌తో కూడిన టెంప్లేట్ ప్రాజెక్ట్ GitHubలో అందుబాటులో ఉంది.

Source: https://dev.to/martinxpn/the-teach-stack-for-building-web-platforms-in-the-ai-native-era-45ka

Optional learning community: https://github.com/MartinXPN/nextjs-firebase-mui-starter