Incredible master class on how to windsurf like a pro. I've been using this tool for 1 month and I think your advice will help me a lot, although I was already using the route file. Great job and thanks for sharing the knowledge
🎯 Key points for quick navigation: 00:00 *🚀 Ahmed introduces Windsurf as an exceptional tool for building AI apps and explains his experience with it by showcasing AI applications he has built.* 00:28 *📄 Ahmed demonstrates a simple invoice analyzer app, allowing users to upload documents and extract data, and a more complex content repurposing app with authentication and Stripe integration.* 01:12 *👥 Ahmed introduces himself as a generative AI engineer and mentions his supportive school community offering resources and Q&A sessions.* 01:40 *📝 Ahmed shares extensive step-by-step resources, including instructions for setting up various tools like Azure and Stripe for these applications.* 02:08 *🌐 Ahmed details the features of Windsurf, a revolutionary AI-powered coding environment by Codium, and its functionalities.* 02:49 *🤝 Windsurf provides a collaborative developer experience using AI agents, helping developers with code generation and application building.* 03:18 *🧠 Windsurf's Cascade feature offers context awareness, improving collaboration and coding efficiency.* 04:17 *🖼️ With a new update, Windsurf now supports image integration for UI design, aligning with other advancements like a model context protocol for AI systems.* 05:11 *🧩 Ahmed showcases the invoice analyzer app, demonstrating document uploads and data extraction using Azure's document intelligence.* 06:07 *🆓 Instructions to set up a free Azure account and document intelligence service, highlighting that new users receive a $200 credit.* 05:53 *📗 Ahmed offers guidance on setting up a Next.js app, installing Azure libraries, and using a custom GPT model for application structure and guidance.* 09:48 *⚙️ Ahmed emphasizes the importance of creating a well-structured instructions file for better AI-generated code accuracy and troubleshooting.* 12:47 *🔄 The importance of including relevant documentation snippets to aid AI models in generating accurate code, reducing trial and error.* 15:21 *💻 Testing the application locally to ensure new functionalities work before moving to the next feature, emphasizing error handling.* 17:33 *🔧 Ahmed advises using GitHub for version control to save progress as checkpoints, stressing the practice of committing changes incrementally.* 19:30 *🚧 Ahmed highlights the significance of starting new chat sessions in Windsor to prevent performance drops from filled-up context windows.* 19:40 *📄 Clear instructions were emphasized for using the instructions file, with the correct field types to ensure accurate results.* 20:08 *🌟 The implementation of the dropdown menu was successful, but the UI needs improvement to prevent future clutter.* 20:51 *🔄 Continuous testing after changes is crucial to avoid errors and ensure existing features work properly.* 21:20 *🖼️ Enhancements were made to the UI for better user interaction while retaining all functionalities.* 22:02 *🥅 Progress was made on the third feature involving data extraction with Azure API and related UI components.* 23:26 *🔑 Environment variables were configured to connect to the document intelligence service, ensuring a secure setup.* 24:21 *🛠️ Error handling and additional improvements led to a seamless extraction of data.* 25:32 *✍️ With all errors corrected and changes accepted, the project moved forward focusing on UI improvements.* 26:41 *📦 The final feature involved adding a download function for data in CSV and JSON formats.* 28:08 *🎨 Final UI adjustments were made according to a formatted reference image, significantly improving application appearance.* 28:36 *🚀 The application build was completed and prepared for deployment following compilation and error checks.* 40:18 *📱 Implemented social media post generation feature allowing users to create posts from pre-written articles.* 40:47 *💰 Introduced token management to track token usage and purchase capabilities using Stripe.* 41:29 *🏦 Set up Stripe integration to allow users to purchase additional tokens using various price tiers.* 42:56 *🔗 Established webhook endpoint setup in Stripe for application redirection and testing in a local environment.* 43:51 *⚙️ Utilized Stripe CLI for local webhook forwarding to test app functionalities before deployment.* 46:05 *🚀 Finalized UI improvements, tested, and prepared code for deployment, resolving all errors and committing changes.* 47:02 *🖥️ Deployed the application using Railway, demonstrating the deployment process and troubleshooting any issues.* 51:01 *📧 Built a real-time translation messenger app allowing language settings customization and real-time communication.* 53:05 *🌐 Emphasized breaking tasks into features, using documentation snippets, and maintaining clear instruction files for successful project building.* 57:08 *🛠️ Suggested best practices for minimizing errors and optimizing the development process with WindSurfer.* 58:57 *💡 Highlighted the utility of GPT-4 model assistance in resolving persistent development errors effectively.* Made with HARPA AI
Thank you The main drawback of Windsurf is its tendency to alter the visual interface without prompting when working on functions. This becomes especially frustrating when you're making progress on a project, only to find that the next day it seems to "forget" previous changes and completely rewrites the code unpredictably.
Appreciate the detailed breakdown! Just a quick off-topic question: I have a SafePal wallet with USDT, and I have the seed phrase. (alarm fetch churn bridge exercise tape speak race clerk couch crater letter). How should I go about transferring them to Binance?
I just do not understand how an AI "coding specialized" can make that much errors coding a simple SaaS ? I'm now (after numerous weeks on simple Saas coding) trying to develop a python "notepad like" within Windsurf + Cascade + Sonnet 3.5 / GPT 4o... it's frustrating how it's just impossible ! Everytime you got a functionality to work good, the AI destroy it adding the next functionality despite your f**ing super hyper detailled "do not touch anything else" prompt.
@@AhmedMukhtarAI One more question - The templates and/or code you present are things you built from ground up or there's a mix of custom code and using commercial no-code solutions? Am actually good with either, just want to make sure it's not a community purely using no-code. Thanks!
errors will always happen, sometimes you have to take a step back and try to understand what it is your trying to do - chat with o1 model tell it what your trying to do and give it snippets of your code to find the issues
Winsurf has no web search function, and its knowledge of Next.js is slightly outdated for the latest release version. You must be very clear about what and how you build, or it will become chaos.
@@AhmedMukhtarAI I want to build an agent system. My goal is to automatically generate workflows for Langflow. If you join the team, can you support me?
📆Work with me: cal.com/ahmed-mukhtar/discovery-call
📚 Access All the Resources in my Skool Community: www.skool.com/ai-business-accelerator/about
Hi Ahmed, where can I find your custom GPT? I couldn't find it with the search function for GPTs.
Thanks, great job! I use Windserf and Cursor. I have a medical background, and now I can create working apps. It’s magic! :)
👏👏
u got the premium or keep creating new accs inorder to use premium credits
Incredible master class on how to windsurf like a pro. I've been using this tool for 1 month and I think your advice will help me a lot, although I was already using the route file. Great job and thanks for sharing the knowledge
Joined your skool today. having that doc in conjunction with watching this vid AND your ever-so prompt reply's in skool ... off to a good start.
🔥
Fire content. The gold here is teaching us how to prompt. The tool is just half the game.
Exactly 👏🏽
So impressed by your work. Very excited to work through all the info you provided.
Good job mate!
Thanks a bunch
🎯 Key points for quick navigation:
00:00 *🚀 Ahmed introduces Windsurf as an exceptional tool for building AI apps and explains his experience with it by showcasing AI applications he has built.*
00:28 *📄 Ahmed demonstrates a simple invoice analyzer app, allowing users to upload documents and extract data, and a more complex content repurposing app with authentication and Stripe integration.*
01:12 *👥 Ahmed introduces himself as a generative AI engineer and mentions his supportive school community offering resources and Q&A sessions.*
01:40 *📝 Ahmed shares extensive step-by-step resources, including instructions for setting up various tools like Azure and Stripe for these applications.*
02:08 *🌐 Ahmed details the features of Windsurf, a revolutionary AI-powered coding environment by Codium, and its functionalities.*
02:49 *🤝 Windsurf provides a collaborative developer experience using AI agents, helping developers with code generation and application building.*
03:18 *🧠 Windsurf's Cascade feature offers context awareness, improving collaboration and coding efficiency.*
04:17 *🖼️ With a new update, Windsurf now supports image integration for UI design, aligning with other advancements like a model context protocol for AI systems.*
05:11 *🧩 Ahmed showcases the invoice analyzer app, demonstrating document uploads and data extraction using Azure's document intelligence.*
06:07 *🆓 Instructions to set up a free Azure account and document intelligence service, highlighting that new users receive a $200 credit.*
05:53 *📗 Ahmed offers guidance on setting up a Next.js app, installing Azure libraries, and using a custom GPT model for application structure and guidance.*
09:48 *⚙️ Ahmed emphasizes the importance of creating a well-structured instructions file for better AI-generated code accuracy and troubleshooting.*
12:47 *🔄 The importance of including relevant documentation snippets to aid AI models in generating accurate code, reducing trial and error.*
15:21 *💻 Testing the application locally to ensure new functionalities work before moving to the next feature, emphasizing error handling.*
17:33 *🔧 Ahmed advises using GitHub for version control to save progress as checkpoints, stressing the practice of committing changes incrementally.*
19:30 *🚧 Ahmed highlights the significance of starting new chat sessions in Windsor to prevent performance drops from filled-up context windows.*
19:40 *📄 Clear instructions were emphasized for using the instructions file, with the correct field types to ensure accurate results.*
20:08 *🌟 The implementation of the dropdown menu was successful, but the UI needs improvement to prevent future clutter.*
20:51 *🔄 Continuous testing after changes is crucial to avoid errors and ensure existing features work properly.*
21:20 *🖼️ Enhancements were made to the UI for better user interaction while retaining all functionalities.*
22:02 *🥅 Progress was made on the third feature involving data extraction with Azure API and related UI components.*
23:26 *🔑 Environment variables were configured to connect to the document intelligence service, ensuring a secure setup.*
24:21 *🛠️ Error handling and additional improvements led to a seamless extraction of data.*
25:32 *✍️ With all errors corrected and changes accepted, the project moved forward focusing on UI improvements.*
26:41 *📦 The final feature involved adding a download function for data in CSV and JSON formats.*
28:08 *🎨 Final UI adjustments were made according to a formatted reference image, significantly improving application appearance.*
28:36 *🚀 The application build was completed and prepared for deployment following compilation and error checks.*
40:18 *📱 Implemented social media post generation feature allowing users to create posts from pre-written articles.*
40:47 *💰 Introduced token management to track token usage and purchase capabilities using Stripe.*
41:29 *🏦 Set up Stripe integration to allow users to purchase additional tokens using various price tiers.*
42:56 *🔗 Established webhook endpoint setup in Stripe for application redirection and testing in a local environment.*
43:51 *⚙️ Utilized Stripe CLI for local webhook forwarding to test app functionalities before deployment.*
46:05 *🚀 Finalized UI improvements, tested, and prepared code for deployment, resolving all errors and committing changes.*
47:02 *🖥️ Deployed the application using Railway, demonstrating the deployment process and troubleshooting any issues.*
51:01 *📧 Built a real-time translation messenger app allowing language settings customization and real-time communication.*
53:05 *🌐 Emphasized breaking tasks into features, using documentation snippets, and maintaining clear instruction files for successful project building.*
57:08 *🛠️ Suggested best practices for minimizing errors and optimizing the development process with WindSurfer.*
58:57 *💡 Highlighted the utility of GPT-4 model assistance in resolving persistent development errors effectively.*
Made with HARPA AI
I can’t find the „Windsurf prompt writer“ as Custom GPT. How can I access it?
Me neither
Thank you
The main drawback of Windsurf is its tendency to alter the visual interface without prompting when working on functions. This becomes especially frustrating when you're making progress on a project, only to find that the next day it seems to "forget" previous changes and completely rewrites the code unpredictably.
Awesome 🥰🥰
is there a way to add the doc links like we do in cursor?
yes
Amazing video! Thanks a lot!!
Thank you 🙏
Hi Ahmed, where can I find your custom GPT? I couldn't find it with the search function for GPTs.
its inside the skool community
@@AhmedMukhtarAI
lol
Appreciate the detailed breakdown! Just a quick off-topic question: I have a SafePal wallet with USDT, and I have the seed phrase. (alarm fetch churn bridge exercise tape speak race clerk couch crater letter). How should I go about transferring them to Binance?
😂😂
Thank you bro.
can you share the link to Windsurf prompt writer
is this windsurf prompt writer only availabe for you skool memebers?
Currently yes
@@AhmedMukhtarAI sure anderstand that is your knowledge
Could you please give us the link yo the PRD gpt you are using.
Thank you
its inside the skool community
I just do not understand how an AI "coding specialized" can make that much errors coding a simple SaaS ? I'm now (after numerous weeks on simple Saas coding) trying to develop a python "notepad like" within Windsurf + Cascade + Sonnet 3.5 / GPT 4o... it's frustrating how it's just impossible ! Everytime you got a functionality to work good, the AI destroy it adding the next functionality despite your f**ing super hyper detailled "do not touch anything else" prompt.
completely agree. i get 85% of the way and then it starts destoying the project
The problem is that it was working fine and suddenly it gives me many cascade errors so it consumes all my credits and I am PRO
same with cursor
You gotta keep giving it the context after some time
@@roxxxxxy what does this mean? Please explain.
In your Skool community will you also teach how to make a custom gpt or an assistant that will enhance prompts just like the one you demonstrated?
i haven't done a video on how to actually create a CustomGPT, however I share the GPT itself for people to use.
@@AhmedMukhtarAI One more question - The templates and/or code you present are things you built from ground up or there's a mix of custom code and using commercial no-code solutions? Am actually good with either, just want to make sure it's not a community purely using no-code. Thanks!
how do you undo changes if windsurf ai goes off track?
If you hover over a previous message that you sent in the cascade chat it will show a button to revert back to that stage
هل يمكنني التواصل معك يا احمد؟
this great. Thanks Ahmed. Is your OpenAI Windsurf Prompt Generator publicly available?
i Get alot bugs.. all the time and cant finish never any project i am try aways doing simple games but i dont know if is about me o the program
errors will always happen, sometimes you have to take a step back and try to understand what it is your trying to do - chat with o1 model tell it what your trying to do and give it snippets of your code to find the issues
i couldn't find the "Windsurf prompt writer“ . Can you provide us the link please?
Currently the prompt writer is for my skool community members only.
Couldn't find the custom GPT either
Winsurf has no web search function, and its knowledge of Next.js is slightly outdated for the latest release version. You must be very clear about what and how you build, or it will become chaos.
yes that's a good point, would be better using previous version
Teach more apps
Where is AZURE cloud in this video
Use more azure .... AZURE Devops in Full stack app development & deployment
I was great until they fuck up with pricing
Windsurf just became a big cash grab so I'm noping out of it
Yeah it’s seems they’ve done a bad move, however they dropped it back to $10 /month for pro plan
@@AhmedMukhtarAI Can you point me to the prompt writer?
Ah, nice tutorial but cost $33 to look under the hood? Pass.
You lost me at "60 hours".
stupid claims.
Great job on this video! 🫡
I can’t find the Windsurf prompt writer as Custom GPT. How can I access it?!
Same here !
Currently the prompt writer is for my skool community members only.
Feel free to join: www.skool.com/ai-business-accelerator/about
@@AhmedMukhtarAI
I want to build an agent system. My goal is to automatically generate workflows for Langflow. If you join the team, can you support me?
Let’s Jump on a call and I’ll see how I can help you
@@LovelyImpala-hu1li ofcourse, book a call please