Great content. Few ideas for front end system design. 1. Hotjar, crazy egg, heat map (analytics system as an injectable script) 2. Google maps, Google docs, Google meet 3. Slack app 4. Goodreads
This is a system which is hard to do in 1 hour even if you have done it already. So, claps for both of you for finishing important parts of it within an hour. Salute!
The content you are uploading here is pure gold! There's a scarcity of system design frontend interviews and you are filling up the gap! Keep up the good work! Also, in the description or comment please do post any resources/blogs that you would like to recommend going through. This will help us to dig deep into the concepts. :D
Great content Chirag... I am new to web development and before watching your videos system design was big hurdle for me but these videos have helped a lot... please keep making these videos and the discussion/interview format are more easy to grab Also in part1 there was mention of collaborative editing features if you could explain that in any upcoming it would be great
Hey Ngoc, yes we can store data in indexed db and as it is stored at users local browser, so it's kind of distributed storage. So, it won't impact perf during scaling.
Not able to understand how live update works for preview. is this via communication between service worker and main thread which manipulates the dom on getting post message from worker?
so the iDB event that he mentioned is to store the changes in the service worker right? that way when a user on the same url on a different tab or window, that request goes to the service worker cache. is that correct?
Service worker can cache the request based on url and can be accessed across tabs. Also data stored in indexedDB is available to all tabs from within the same origin. Let me know if you still have any doubts.
Hi sir, I am new to frontend development and have no knowledge about web worker, service workers & indexDb which you guys discussed. Can you please share the resource from where I can learn these advance topics and get a good hold on these topics to understand system design better? Thanks in advance
How does the ACTUAL content updation happen inside the ? Say, you make a TS code change to set a bg color to red. What all steps happen until the becomes red? User does code change -> triggers worker to transpile, etc -> code gets updated in iDB -> code gets updated on server (if needed) -> -> becomes red What is this SOMETHING that is happening which actually makes the red? What I am guessing is that the internally has some script to hook into the iDB and upon any change, it reads and executes all the scripts on its document object i.e. the key here is the implementation of the 's document. Is this correct?
I honestly couldn’t understand the approach, The solution that I can think of is, Keep the whole directory at the back end. Send incremental changes in file using sockets. Update file on back end. Run a live server on backend machine inside a docker container. Serve it and use a proxy or a tunnel like ngrok to serve it over network and show it inside on frontend. On frontend, the only data we need is the directory structure and the file content of the active file only. There is no need to do anything on frontend like transpiling etc.
Great content. Few ideas for front end system design.
1. Hotjar, crazy egg, heat map (analytics system as an injectable script)
2. Google maps, Google docs, Google meet
3. Slack app
4. Goodreads
Thanks for the great suggestions. Yes will be picking them on priority basic 👍
This is a system which is hard to do in 1 hour even if you have done it already. So, claps for both of you for finishing important parts of it within an hour. Salute!
Thanks a ton 😊 Keep watching and sharing #chakdeSystemDesign series 🚀
The content you are uploading here is pure gold!
There's a scarcity of system design frontend interviews and you are filling up the gap! Keep up the good work!
Also, in the description or comment please do post any resources/blogs that you would like to recommend going through. This will help us to dig deep into the concepts. :D
Hey Gaurav, Yeah, I will start sharing relevant doc in description in upcoming videos 👍. Please do share in your network 😊
Couldn't imagine such a rich content on frontend system design be availble on TH-cam. You really touched most of the doubts I had
Glad you liked it. Keep watching and do share in your network 🙂
Keep uploading the videos 🔥🔥
There is nothing like this on youtube
Thanks Aditya 😍. Keep watching and spreading #chakdeSystemDesign
Please keep doing more of FE system design, it will help front end community a lot. Great job.
Thanks Ravi 🤓. Keep watching and spreading #chakdeSystemDesign
Great content! One question, how do you use web worker to actually build and run the project?
Baniya's are good at creating businesses who thought they would also take over in designing systems 😜. Great content
Lol, keep watching & sharing ❤️. Help this baniya to make people fall in love with Chakde System Design series 😛
@@engineerchirag Full support dont worry 👍
Great content Chirag... I am new to web development and before watching your videos system design was big hurdle for me but these videos have helped a lot... please keep making these videos and the discussion/interview format are more easy to grab
Also in part1 there was mention of collaborative editing features if you could explain that in any upcoming it would be great
Great to hear! Noted, will plan a video soon. Keep watching #chakdeSystemDesign
Great content . But how we store user code data, in file system or database and any problem when we have lots of user
Hey Ngoc, yes we can store data in indexed db and as it is stored at users local browser, so it's kind of distributed storage. So, it won't impact perf during scaling.
🔥🔥🔥
Great session. Learnt a lot :)
Not able to understand how live update works for preview. is this via communication between service worker and main thread which manipulates the dom on getting post message from worker?
Yes, as persistent store is common for both the threads, on getting update from worker thread, main thread updates the assets and rerender
so the iDB event that he mentioned is to store the changes in the service worker right? that way when a user on the same url on a different tab or window, that request goes to the service worker cache. is that correct?
Service worker can cache the request based on url and can be accessed across tabs. Also data stored in indexedDB is available to all tabs from within the same origin.
Let me know if you still have any doubts.
Hi sir, I am new to frontend development and have no knowledge about web worker, service workers & indexDb which you guys discussed. Can you please share the resource from where I can learn these advance topics and get a good hold on these topics to understand system design better? Thanks in advance
I will be adding all such resources link here: github.com/engineerchirag/front-end-system-design Do star the repo
@@engineerchirag kya pucha hai aur kya bata rahe ho
How are you storing the node modules in the browser?
Check out IndexedDB of codesandbox, you will find transpiledModules, where it store stringified version of transpiled node_modules.
How does the ACTUAL content updation happen inside the ?
Say, you make a TS code change to set a bg color to red. What all steps happen until the becomes red?
User does code change -> triggers worker to transpile, etc -> code gets updated in iDB -> code gets updated on server (if needed) -> -> becomes red
What is this SOMETHING that is happening which actually makes the red?
What I am guessing is that the internally has some script to hook into the iDB and upon any change, it reads and executes all the scripts on its document object i.e. the key here is the implementation of the 's document.
Is this correct?
I honestly couldn’t understand the approach, The solution that I can think of is, Keep the whole directory at the back end. Send incremental changes in file using sockets. Update file on back end. Run a live server on backend machine inside a docker container. Serve it and use a proxy or a tunnel like ngrok to serve it over network and show it inside on frontend. On frontend, the only data we need is the directory structure and the file content of the active file only. There is no need to do anything on frontend like transpiling etc.
❤
thank you
You're welcome
🔥🔥🔥