10x your Cursor Workflow with Memory Bank
Key Takeaways
The video discusses how to improve cursor workflow with Memory Bank, highlighting tools like React and providing resources such as the SOLID React book and Memory Bank rules gist.
Full Transcript
I was on Twitter the other day and I stumbl upon this amazing technique introduced by Klein which is called the Klein memory bank or for a shortcut memory bank and I was like oh what is this this is really interesting what does it do and as client actually claims they are claiming that this is actually going to you know 10x your workflows with AI agents which is specifically the client AI engines but this can be used with any AI engines like cursor or maybe GitHub Cod pilot stuff that allows you to customize those agents through custom rules which most of them do so how does this memory bank thingy kind of works the instructions sets to transform Clin into a self-documenting development system that maintains context across sessions through a structured memory bank and like quot quote unquote memory bank that's what they call it which is pretty great name actually reflects what it does perfectly which is amazing so in ures consistent documentation careful validation of changes and clear communication with users and that's like what any agents nowadays is actually missing or needs in order to 10x the workflow speed and and and be better like generating the code that you are wanting them to generate so yeah the projects in here is going to be like you know this memory bank kind of technique actually works for any project that needs context tracking projects of any size both new and ongoing development so you can initialize your new projects or either if you've got already got a project currently in here you can go and ask it to initialize or start working with the memory bank of your choice and um yeah longterm maintenance work just to keep track of the context and make AI do all the heavy lifting for you so I said before this is for client so client provides the instructions in here and what I did is actually went through and tried to read through this and tried to or kind of like mock the same thing but made a little small modifications for this to work inside of cursor AI because I'm a big fan of cursor AI I use it daily for my work and uh yeah I wanted to do that for cursor AI so what they say in here in Clin you can copy these custom instructions which is a very long prompt with mermaid charts which is like flow charts that explains how things work they like kind of like split this uh memory bank into multiple markdown files it C in here like project Bri for example product context active contact system patterns Tech context and ress which technically just tracks the project the progress of the project and what features have already been implemented what features are still or in current Implement implementation current development stuff like that so this will allow it to like track everything and these rules once injected inside of the AI engines is going to convert it into like a memory bank or a self-documenting tool so this one you can go and copy it out but I don't advise you that I've already put a guess for it so you're going to find Link in description below you can go to guest rules. MD in here this is actually the cursor's memory bank I've put everything in there and as clear in here it's just like a simple markdown with flowcharts but these flowcharts are perfect for the AI to understand how it should manage this context and then memory bank and split them out like across these different files from like project brief to the product contact the system patterns the tech contacts and you could read more about every single one of these and what each one does for example like the project brief in here markdown file is the main file in here that actually shapes all other files and it's actually created at the project start if it doesn't exist defines core requirements and project goal like big scope project goals and source of truth of project scope technically now for the product context in here this is like why this project exist problem is solved how it should work user experience goals so every single time you don't know exactly what each file does you can come back in here even though like I mean for you as a human you don't need that because this is mostly for AI so there's active context in here system patterns for example for the text context or Tech context in here it's going to have all the Technologies you use the development setup technical constraints like the dependencies for example if you're using package.json it's going to list all the dependencies in here that you're using going to read the package.json it's going to put everything there for you and progress in here it's going to tell you what progress have you already done in the projects what's left to build current status and known issues and all of these together are going to build the memory bank and of course the the file in here the rules in here are going to tell it how to kind of like change or modify those files how to create them how to keep them in sync how to update them every time you ask cursor like to oh upate me this feature update this section of the website or something like that it knows how to update the documentation or the memory bank alongside that because that's very very crucial all right so going back to cursor in here I've got my projects roast youi projects if you're not familiar with that already like cover this project on a separate 10 hours video forl this from zero to deployment to getting your first uh payment through stripe you going go ahead and check it out it's for roasting user interfaces Us in AI but if you're in cursor in here to put the rules together you can go into cursor settings you're going to find the settings in here let me just put this one like this so there's a plenty of stuff uh you can go to rules and as clearly seen here for user rules these preferes get sent to the AI on all chat composers and command key sessions so this is actually what you want to send to the AI like every single time start a new session to make sure it is like it knows of the memory bank and it's going to utilize the memory bank on the files and reads them through which is very important of course so just copy paste that one you put it over here as is as marked down and that's it pretty much that's it all you need to do for setting up in this uh if I put any modification you're going to find it in the gist in here so if I find any better ways to do it but yeah all good so this actually all you need to do for cursor and for asking it to start the memory bank stuff so I've already haded this chat in here to initialize and all I said is initialize memory bank that's all and I'm using Cloud 3.7 Sonic thinking and he started doing that ascl here started to read the MD file he started reading all the directory or the current directory in here all the files inside of it the pack. Json uh the SRC for example it created the directory for me like the memory bank and it started putting all the files together like projects brief uh you know projects context in here there is system pattern everything it created all of those for me and even put the cursor rules in here which I believe with the new recent version of cursor they've changed to like a directory but this is still supported you can change that whatever but this is still supported I said before now it created this folder for me which called the memory bank as cre in here has active context product context progress project brief uh system patterns and Tech context so for example if you go on the project streen here you're going to know like oh project brief it's called roast UI it's have an overview so roast UI is an Innovative tool that provides AI driven analysis for uiux designs it's primary purpose to help designers refine their designs by offering comprehensive insights and quickly producing enhanced layouts using AI so it puts all of that there's the core requirements in here projects goal create a tool that has designers improve their U ux design I mean it's going to analyze the project for you and it's going to put everything there but if you're starting a blank project they still could work of course so is everything's going to be like empty in here maybe you could provide some context for first to start with like what the project is but as I said before the memory bank is going to be automatically updated for you using cursors whenever you're talking to cursor whenever you trying to implement new features so everything is going to be like updated in real time as you are developing your projects which is amazing and if you want to check out the cursor rules that were autogenerated for you using the memory bank you can check that out as well so it like it has the structure in here the different coding patterns we use we mainly use like you know functional components with hook State Management we use zustand uh API panels in here we use server components for data Fain styling we use T1 CSS for styling with some like utilities there's a database we use sqlite and know it's deployed on flyo in here with Milt region distribution it's pretty good it's like did a fullon analysis on the project and put a documentation or a memory bank on it all right so this actually our rui page Here Local Host 2000 and uh we have one missing part that we need to implement which is the about page in here so this is a great opportunity to test the new memory bank because about page is like you know putting all things together uh from what the up is and what it does and everything into an about page so now if we want to test out the memory bank how efficient it is and how curser is going to handle this and how well is going to be able to create an belt page for us from scratch well this is the right opportunity for that to do so so let's go go back let me uh clear everything I'm going to start a new chat in here and I think we have uh like a page I think is probably main there are the main page in here there's about yeah there you go this is the about page so I'm going to include this I think this is already included in the context I'm going to include this incursor in here now because incursor we don't have this notion of like plan mode or act mode like Klein does clein has two workflows two work core workflows one is the plan mode to to can actually just discuss the difference plan with the AI agents and the axe mode is going to like take that plan and implement it into like code and documentation and everything so because we don't have that and in the kind of like the rules with provider already there's this core core workflows with plan mode and axe mode and both of them have this uh mermaid flowchart in here of how things should work I mean we could go in and instruct Cru just like do plan mode so I'm going to do plan mode just like that and actually start typing um I'm going to say let's build the uh about page for roast UI that is pretty simple and reflects what are the core principles of the project and the end goal to help designers and developers to create better uiux designs with a okay so I'm going to click entry in here hopefully it's going to do plan mode for us it's going to enforce plan mode I'm I'm using 3.7 thinking Sonet 3.7 thinking SC in here it's reading uh the different stuff the different files the design system aspects I'm going to give it some time in here uh so it looks like he failed and he went straight into implementation even though I specifically stated that I want plan mode so uh let me try to do this a different way so I'm going to close this out uh I think we have I think they have implemented something so let me just go ahead and uh completely disregard that yeah so I reverted the file in here I'm going to start a new composer and after this I'm going to do please do the planning first before jumping into the implementation I'm going to say use plan mode okay let's hope this time it knows what plane mode is and it kind of like reads the rules we've put um so yeah there you go now it reads the memory bank which is amazing so I think it it got what it needed and it knows that it reads the project brief the product context the system patterns so I think we're one step closer to uh having fully autonomous thing so sometimes it doesn't read it but specifying it like this it looks like it does hopefully could out what allow like different modes like client does cuz I think that is incredible if I want to like toggle you know between plan mode and and axe mode uh but nonetheless this is pretty good all right so it looks like it got us a plan so plan for rui about page implementation there's the overall structure there is the content sections uh design elements in here implementation approach so it puts everything in a really well way uh even put like the different sections that going to put inside of the about page like the hero section the Miss Envision uh how it works core principles team and background and call to action to you know try the RO two on dashboard and uh but unfortunately he didn't stop just for planning and like asked us oh do you want to implement this I think we have to specifically tell it to do so cuz I had occurrences before where I specifically had to tell it do not Implement any code just yet just discuss the plan with me then I'm going to tell you when to implement the code if the plan is pretty good so yeah that one it it didn't cut it okay it just went straight into implementation but still fine because I believe the plan in here looks pretty good so there's no harm into implementing that plan cuz it feels pretty nice uh so yeah so let me check the code real quick so we put this about page index it's using CVA in here as the rest of the project which is great for clean cut uh step item principal card there's just about in here Mission section okay it looks uh well I don't know I got to I got to check out how it looks like first in order to judge but yeah it looks pretty structured I don't know why this this Cass name does not exist or something what is this ex icon so oh okay it doesn't have a class name unfortunately so so if you go back and check out the about page in here well honestly it's so like better than I expected it to be cuz AI is not really that good in design in and being creative so yeah revolutionizing UI design with AI so there's our mission how roast UI Works uh there's the core principles in here which is in a really nice cards in here or Shian cards believe and there's like buildbook Developers for designers and there's like view projects on GitHub missing uh some sort of like icons here and there and there's the CTA in here try roast you ey now which going to take you to the playground which is amazing and there's the footer I mean I love this there's one missing piece that I could think of right now which is uh let me ask it to do so so he's trying to do the lanting oh I think I stopped Midway through this so I got to run the command so let me just run the Comm in for this one this will do the Linton and I think it will detect any issues if there are any so L Comm in didn't reveal any specific erors we're seeing let me fix this be what icons about the components so it tries it knows about the icons issue that I was just describing which is amazing I'm going to click resume here so all right so it looks like it fixed the icons issues I'm going to just straight through except the file in here it looks pretty good uh now there is one thing missing which is the nav bar on the top here that he's completely missing so I'm going to indicate in here include the nav bar in the about page as well okay so I mean the Naf bar is a reusable component have put together before so it it just matter if like rendering the Naf bar inide of the about page and probably that's it all right so it looks like it imported the nav bar in here and it's it's uh rendering so let me check if it is rendering that's it is good uh back the N bar is right over there Jus not in here can access my dashboard and everything yeah everything looks pretty good in here from like an about page perspective uh you can go back in here you can go back to the about page well there are some adjustments I could make but I'm not intending to make it perfect in this video I just wanted to give you guys how to 10x your cursor AI uh sort of like workflows and how to work better because context is key in the AI word so if if the AI doesn't know what context or anything about your project it's not going to be able to efficiently implement the project or if you have like constraints in there and you're not telling the AI about it and the AI doesn't well I mean it it's going to completely avoid the constraints right and it's just going to go straight through so yeah context believe me I've been working with ar for a long time now and uh the one thing that I never regrets is providing as much context as possible to the AI or llm I'm working with and this way you know keeping the documentation all in one place in like the memory bank the memory bank way uh in in mark down file specifically because it's super readable for you like a human can read and modify that one as well it is amazing so let me know guys what you think go ahead and give this one a try uh maybe clein's one is better I haven't tried CLI one so let me know if you did and by any chance let me know in the comments but this one is amazing I know with some improvements this could be way much better it has huge potential as far as I can tell but uh yeah anyway guys thank you guys for watching hope you guys enjoyed and don't forget to go in and check out the roasty wine here if you're interested roasting new design there's a new features coming out to this with free trial for people to try it out but if you're also interested in uh clean cod in react which a lot of people loved already like by thousands in my previous videos you can go in and grab their solid react book in here on solid react. but until then thank you guys for watching see you hopefully in the next one
Original Description
📚 Learn to write clean React code with the new SOLID React book:
https://solidreact.dev
You can grab the memory bank rules from this gist:
https://gist.github.com/ipenywis/1bdb541c3a612dbac4a14e1e3f4341ab
#javascript #cursor #python
🎉Our Newsletter is live! Join thousands of other developers
https://islemmaboud.com/join-newsletter
🐦 Follow me on Twitter: https://twitter.com/ipenywis
🐦 Follow me on Twitter: https://twitter.com/ipenywis
💻 Github Profile: https://github.com/ipenywis
Made with 💗 by Coderone
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from CoderOne · CoderOne · 0 of 60
← Previous
Next →
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
Laravel CMS | N-01 | Getting Started and Environment Set Up
CoderOne
Laravel CMS | N-02 | Routes, Controllers and Views
CoderOne
Laravel CMS | N-03 | Dealing With Assets and Page Layouts
CoderOne
Laravel CMS | N-04 | Migration, Models and Adding Categories
CoderOne
Laravel CMS | N-05 | Showing Added Categories, and Session Messages
CoderOne
Laravel CMS | N-06 | Edit\Remove Categories using AJAX and Popups
CoderOne
Laravel CMS | N-07 | Add New Post
CoderOne
Laravel CMS | N-08 | Creating a Basic Laravel Blog
CoderOne
HTML5 Canvas For Beginners | Getting Started | #01 with Webpack
CoderOne
HTML5 Canvas For Beginners | Drawing Basic Shapes | 02
CoderOne
HTML5 Canvas | Drawing Text With Circles | Part 01
CoderOne
HTML5 Canvas | Text Animation and Circle Collision | Part 02
CoderOne
Complete Guide To Web Development In 2018
CoderOne
AJAX & JSON Explained | Examples
CoderOne
Visual Studio Code Web Development Setup and Extensions
CoderOne
Electron Build Desktop Apps HTML/CSS/JS - Getting Started 01
CoderOne
Electron Build Desktop Apps HTML/CSS/JS | Creating Windows and Processes 02
CoderOne
Electron Build Desktop Apps HTML\CSS\JS | Dialog, Sessions and Cookies 03
CoderOne
Electron Build Desktop Apps HTML\CSS\JS | Custom App Menu & Context Menu 04
CoderOne
Electron Build Desktop Apps HTML\CSS\JS | Package, Build and Deploy your App 05
CoderOne
Node.js Brief Beginners Introduction #01
CoderOne
Node.js How Modules Works & NPM #02
CoderOne
Node.js Working With Events and Event Emitter #03
CoderOne
Node.js File System (Read and Write) FS 04
CoderOne
Node.js Create a Basic Server Using Express 05
CoderOne
Json Web Token Authentication JWT Explained Securing API
CoderOne
CSS Flex Box Design | Practical Examples |
CoderOne
API How It Works With Practical Examples
CoderOne
MongoDB Getting Started 01
CoderOne
MongoDB Working with APIs and Practical Examples
CoderOne
Create a Command Line Interface (CLI) Using Node JS #01
CoderOne
Create a Command Line Interface (CLI) Using Node JS 02
CoderOne
Build React Apps | Introduction And Getting Started #01
CoderOne
Build React Apps | Working With Components And Multiple Rendering #02
CoderOne
Build React Apps | App State Management | Practical Examples #03
CoderOne
Build React Apps | Getting Started With Flux (Intro) #04
CoderOne
Build React Apps | Create a Clock Timer Using React 05
CoderOne
Build React Apps | Create a Clock Timer Using React 05 | PART2|
CoderOne
CSS Preprocessors Getting Started | SASS and LESS | Practical Examples
CoderOne
Regex Introduction | Learn Regular Expressions 01
CoderOne
PHP VS Node.js Which is Best For Web Development
CoderOne
Drag and Drop Using Native Javascript 01
CoderOne
Drag And Drop Using Native Javascript 02
CoderOne
Master Git (Version Control) in One Video From Scratch
CoderOne
Let's Learn The New Javascript ES6 Class Syntax
CoderOne
Let's Create A BlockChain On Node.js
CoderOne
Best Online Code Editors For Web Developers
CoderOne
Let's Create a Modern Login Form on React #01
CoderOne
Let's Create a Modern Login Form on React #02
CoderOne
Laravel CMS | N-09 | Admin Registration
CoderOne
Laravel CMS | N-10 | Login and Authentication
CoderOne
Let's Create a Twitter Bot (Listen and Retweet)
CoderOne
Rapid Webpage Creation With Emmet (HTML & CSS)
CoderOne
Create Popups and Modals Using Native Javascript, HTML and CSS
CoderOne
Promises and Callbacks on Javascript With Practical Examples
CoderOne
Create Collapses using Native Javascript, HTML and CSS
CoderOne
Let's Learn Typescript (Javascript Devs) | Getting Started 01
CoderOne
Let's Learn Typescript | Interfaces and Generic Types (The Typing System) 02
CoderOne
Let's Learn Typescript | Work With Classes, Modules and Enums 03
CoderOne
Let's Learn Typescript | React and Webpack With TS 04
CoderOne
More on: AI Pair Programming
View skill →Related Reads
📰
📰
📰
📰
Why Vanilla JS?
In the article below, I am sharing my story of building SaaS product in vanilla js and explaining why I decided to go with this approach.
https://guseyn.com/html/posts/why-vanilla-js.html
Dev.to · Guseyn Ismayylov
How to Create a Cursor Tail Using HTML, CSS, and JavaScript
Medium · JavaScript
I built a landing page with Three.js, vanilla JS, and zero frameworks — here's what I learned
Dev.to · Ayush Shekhar
Part 1: Why I Rarely Use useEffect Anymore (and what I use instead)
Dev.to · Alejandro
🎓
Tutor Explanation
DeepCamp AI