How We Built AlgoExpert's Front End (building a web application)
Вставка
- Опубліковано 22 сер 2024
- If you've ever wondered how to build front end web apps, then this video should be interesting. I dive into the front end that we developed for AlgoExpert using React, Redux, and JavaScript.
Check out the video on how we built AlgoExpert's backend: • How We Built AlgoExper...
Prepping for coding interviews? Practice with 77 video explanations of popular interview questions and a full-fledged coding workspace on AlgoExpert: www.algoexpert.io (use "clem" promo code for a discount!)
![АЛАУДИНОВ у Скабеевой: эти их ВСУ нас НЕ ДОГОНЯТ 😁 [Пародия]](http://i.ytimg.com/vi/an0anqU4WGQ/mqdefault.jpg)
As always, if you're interested in buying AlgoExpert, you can use the promo code "clem" for a discount on AlgoExpert.
Awesome work! Im curious, what tool did you use for "whiteboarding" in your course videos?
Do you add additional questions on monthly basis?
Can you do a video about the design processes?
How your decision making progress looks like, regarding which features your product needs and their technical design.
buying the whole thing or an account 😄
Loved the video!
Just a question, any particular reason why you didn't use Angular?
I have nothing specific to comment, but still I am commenting because "it helps with the youtube algorithm".
The real MVP 😭
@@clem hi there came across you from your videos with josh fluke, how exactly do you bring the multiple languages into the react loader, is it purely through an internal document path through a component or more complicated than that, seen it in a few websites but never sure how its been achieved.
Whoaa what a hero
it's so funny!!
So you're the one whose advertisement comes everytime I see a tutorial on UA-cam. Nice.
Lol same
Love from India!. thanks for building AlgoExpert. Bought annual subscription for both the algo expert and systems expert few days ago. Before that i was scared of algorithms, dint knew math for it but, your DS videos covered that part too. I am preparing for Nvidia. Will message you if get selected there.
Awesome! I really hope the products help you a lot; best of luck!
This has become one of my favorite youtube channels. You always present very real information, no less, no more, keep the hard work going. I'probably going to buy the anual suscription.
Really glad you’re enjoying the content!
I'm having the same thoughts...At first I was kind of reluctant to admit it because lots of yt channels seem to be running out of practical content after a while, but if Clement keeps this quality he might actually convince me to purchase AlgoExpert once I get enough money for it lol
STFU bot
@@quervo151 well, that's the first time I'm called a bot
"full on tortellini" got a subscriber for that, mate :D
And “Solid fettuccini”
+1
tortellini is very compact and modular.
Love from India.
C# on AlgoExpert!!! I cannot wait!!!! Although Java is pretty similar, having C# would be amazing!
can't agree more
C# is Java done right :)
Algoexpert is one of the most professional web system/platform with advanced features I already found on the internet. Thanks for the amazing video and keep going man! ❤🇧🇷
As a TypeScript developer, it is easy to migrate to JavaScript. But if you are a JavaScript developer moving to TypeScript is a bit head-ache. Because TypeScript has strict coding guidelines and for large scale web applications and especially when you work in a Team, TypeScript is acceptable and is debug-friendly.
Make a video about typescript vs javascript, differences, advntages and disadvantages, etc
AmateurPT Good idea!
Yes I would definitely watch a video on this topic!
javascript defines for you what type the variables must be, in typescript you will define what type each variable must be.
I would choose typescript any day over javascript. I just fell in love with it.
What even is typescript I haven’t even heard people talk about it at all🤔(obviously it’s a similar language to JavaScript) but I mean why does no one ever mention it?
Hi Clement! Would it be possible to do a tutorial on how you manage to handle the re-ordering of the questions! It sounds really interesting and useful for many websites! Thanks mate
Love to see actual developer sharing about the design thoughts and it's SO TRUE, user probably never realize the massive work behind the scene to make tiny component work lol
I'm from India, and must say wooow it's lot of work and fully filled with complexity inside..
I really like your videos! I said this many times but i really inspire to study more to have a better job in front end dev
Dude, genuinely great to listen too, your enthusiasm and passion really shining through, and phew, what you've already done in your short span as a dev is impressive
Loved the "heart india"!
Your passion for this project is very inspirational.
I was looking for it online since very long. And I never know how that you had a video on it. Awesome, thanks!, brother.
👆Congratulations 🎉 🎉you have been selected among my shortlisted winners message me on Number above to claim your prizes☝️
Just did an AngularJS to Angular conversion. Part of that conversion process was moving the client and Node backend to TypeScript. It was hell, but it was so worth it. Having some degree of compilation illuminated issues at transpile time instead of runtime, and was a real time saver.
Hey man,
I got smacked by a coding interview about a week ago. I realized I needed to do something and I’ve only been using Algo Expert for a couple days now and feel immensely better about taking an interview again. THANK YOU for changing the course of my life through the jobs I can get because of the extremely helpful practice you provide.
Hi, Can you make a course on this frontend technologies that you have discussed in the video and release the course on the algo expert.
I bought a year plan today. Though I typed in the url I actually found the site on UA-cam. Thanks for sharing your 10-mile view on the front end.
👆Congratulations 🎉 🎉you have been selected among my shortlisted winners message me on Number above to claim your prizes☝️
I like how you explain things with clarity and passion. It sounds like you really want the audience to understand and learn something!
When u thought front end was only html with css xd:
Glad that you considered the Indian network issue and connected yourself to rural India as well. Appreciate it.
Wow that's unprecedented access to a tech business. Great, please keep these videos coming!!! It's so interesting to see how a successful business was built and grown. I like all of it, the technical part, the business model, everything. Congrats, no wonder ur UA-cam channel is growing like crazy
Great video, I love that you give real life examples and share your experiences. Not sure if it would be your style, but would you be able to just think up a random project or idea, and do a 'live coding' video. I know there are many out there, but somehow you really do add a lot of personality in your videos whereas other tutorial vids lack that spark.
Thanks so much for the kind words! As for what you said, I’ll try my best; I’ve got a few ideas for this in mind, but the only problem is that doing these types of little projects takes quite a bit of time-something that I unfortunately do not have enough of these days!
I don't know why this suddenly popped on my feed, but I'm glad it did. I do work with React, so if you need interns to work on updating AlgoExpert or SystemsExpert at any point, I would be glad to send in my resume!
This is a really great way to market a tech product to tech people.. The technical way.. Only the techlead face is missing here. Great job.
I just feel any product's development happens the same way. I have been working on a real time project that has microservice architecture, Kafka behaving like a data bus, jwt authentication and elastic search for indexing the data with MongoDB as data store. While for frontend, it is exactly the same react, redux and axios.
I think the only difference between a product launched and a product not launched is about the effort that you put in, than the complexity of the project. Most of the projects are fairly simple and are easy to implement, but the effort makes all the difference.
Just felt like sharing.
5:00 - "... full on tortellini." 😂 Love it!
lol I just subscribed just because of all the different spaghetti's you mentioned, plus your honesty.
It's refreshing that people like him do spaghetti code, and he's not ashame to admit it 😆
Great video Clement! Would love a mini series, where you explore algorithms you've applied, in actual products, outside of interview problems. Algorithms in the wild? :thinking:
Watch this has reassured me I’m moving in the write direction with the products I’m developing since I use all the products and services mentioned here 💯🙌🏽
I just got an ad of AlgoExpert before watching lol
That front end sounds like it was a blast to build. I definitely could use more projects like that.
I Think Clemente you should make Algoexpert Frontend and Backend code open source. This will be real contribution to the community.
👆Congratulations 🎉 🎉you have been selected among my shortlisted winners message me on Number above to claim your prizes☝️
Can you comment more on what hardware/software you use to produce the explanation videos? What sort of drawing tablet do you recommend for this sort of thing?
Amazing content, keep going.
It's nice to see a video taking about the reasons behind choosing the technologies you uses in AlgoExpert.
Like why react over angular.
Great video.. Pleeeaase make more of these.. Like deconstruct UA-cam frontend and backend. You could be popular in that niche.. Not even the Techlead does it
Pls talk about the design decisions you made, more about caching and what database did you use and why. Also where did you host your website
Clement really motivates me. Thank you for this youtube channel with quality contents. i mean the real deal. not like other channels that just talk about themselves and doesn't give clear idea about the topic.
Can you please make a video on "How Should We Study Data Structure & Algorithms At Home to Nail a Interview in Such Big Companies". And please try to include 'Resources'.
@clément mihailescu
I've been following Clement for some time now, but have yet to check out the Algoexpert website. Just from watching this video and watching him explain the sites complexity, I must admit that this website looks phenomenal! 🤯
TypeScript is 🔥🔥 but refactoring to it...
Haha, I know! I think the key is to just do it incrementally.
Great video. I am very curious to know if your website is built on react, how did you solve SEO problem? And did you ever consider any of the CSS-in-JS solutions?
That was great. Do more of this kind of content please. Getting a high level view of a complicated system gives some insight about all these technologies.
👆Congratulations 🎉 🎉you have been selected among my shortlisted winners message me on Number above to claim your prizes.
Thanks for the heart to INDIA. also i am about to buy annual subscription but not now but sure in 1.2 year....thanks for the videos to make us aware of technologies.......
Wow it was interesting. Now make video on how you design your website, by which resources you make it so beautiful.
Clement is like the Ben Shapiro of software engineering. Fast, sharp, and straight to the point.
As beginner web developer, this put a lot of things into perspective for me. 🤝
I actually already fell upon some of these videos but since Joe put the stamp of approval I subscribed. Keep up the cool vids. Love the intro card tricks
I *really* enjoy the quality and variety of educational videos on this channel. All I can say is *keep* *it* *coming* ! :)
2020 still relearning how to be a badass full stack dev again. never ends and it's always fun.
I really enjoyed your video here. It's a new concept that is less seen on YT, but it really helps to get a general overview. Just curious to know, if you have anymore walkthrough videos like this? or anyone else on YT, that'd be really helpful!
Would like to see a video on the process monetizing algoexpert , especially through the eyes of you as software engineer and not a business or marketing guy
Great to know; stay tuned!
How do you check if someone is screen recording the videos
Himanshu Motiramani There are certain things in business where you end up having to rely on people’s good faith-this is one of them 😌
@Tyler Durden Sad. That is actual hardwork. Hope you atleast NOT share with others.
It's actually relatively easy, only Javascript l33ts know how to.
Himanshu Motiramani I found a few clones of the entire website on nulled.to. The piracy community really knows what they're doing.
Daintree calm tf down. Edited.
Highly appreciate algoexpert team sharing details of creating a live project for technical sharing. 😊😁😇 support form India.
We ask, and you provide. Thanks for the video, Clément!
Also, Clément what are your opinions on using CSS libraries (Bootstrap, Material, Semantic-UI, etc) vs custom CSS when building a product?
I love this! Once I saw the website, I had to know how it was built. I'm glad you made this video.
👆Congratulations 🎉 🎉you have been selected among my shortlisted winners message me on Number above to claim your prizes☝️
That was really interesting, thanks. Would love to see more vids on how you created and the business and how it operates.
Hey Clément, thanks so much for this insight into AlgoExpert's design! How is the code editor compiling/running your code, and how do you keep that process secure?
Wow i achieved watch a video with "AlgoExpert" in the title without appears me a the AlgoExper adverttisement.
I am the choosen one
Really like this kind of video about building a real-world website. Could you make a video about your process of UI/UX design (before or after implementation)?
very interesting and useful to hear such information! thanks.
Love the transparency, definitely made for an interesting video.
Did u come up with the ui/ux design your self or you got a designer for that
Yes, I designed the UI/UX myself. I had actually originally planned on covering this in this video but decided to separate it into another video at the last minute; coming soon!
@@clem awesome one last question I know you are very busy. But can I take courses on algo expert without knowing anything in data structure and algorithms or you would advise i learn the basics then join the program? Cause am currently learning javascript
idris you might want to first learn the basics of the language of your preference since you need to have a solid knowledge of how to declare variables, arrays, functions and so on and so forth,it is basically what you will use to implement your algorithms.
@@joanperezlozano7405 I see thank you perez
@@frownless Joan Perez gave a good answer; we typically recommend that you be familiar with the basics of programming (for loops, if/else statements, functions, etc.). You should be able to become familiar with these in a couple of weeks if you're a complete beginner. After that, AlgoExpert is fair game and will likely help you hone in on your programming skills (apart from helping you prepare for coding interviews)!
Love from India Clem! ❤ Hope interviwing with you oneday! :)
Came here for the "Full on tortellini" 🤣
Before watching a video if you hit the like button, it's not you, it's the clement magic working. 😂 Happy New year clement 🙂🥂🎊❤️
Thanks for that overview Clem. Really helps us understand the foundation of building a business!!
After this video, you are better than Techlead for me. Lover your informative content. You educate us about how web application is made and business side of it too. I would like to see more of these videos, where you discuss in more difficulty about the most difficult things you faced as a front end developer, while making algo expert and how you overcame them? Do you have a team, and if yes then how you hire them? And would love to know what all difficulties you faced starting the business side of Algo Expert?
I would love to see the business version of this video, it would be the perfect addition (because you've now made video's for the frontend/ui and backend/infrastructure. Thanks for making these Clément :)
Love ❤️ from India Buddy
It's nice that you're working on C#
"I uchiha madara declare this the best frontend I have ever seen. "Period.
Hey! Thanks for the great content!
Did you implement the drag and drop feature on the questions list yourself or use a library like react-dnd? In general for ui-elements, are you using any popular libraries or implementing it all yourself?
I'm watching this despite the fact that the only coding I know is :
#include
int main (){
printf("hello world
");
return 0;
}
Learn python bro
I can watch your videos all day. Thanks for great content ! :)
thank you, really appreciated the honesty!
(and finally could watch without ptsd of my failed interviews:D)
Can we get a video about the testing infrastructure of AlgoExpert.
Please try to make one, it would be super helpful.
Hey! Awesome video! If you don't mind me saying I think you should create a online tutorial course where you explain how to solve these very difficult problems that you talk about in this video. It would help A LOT the rest of us to become better engineers
AlgoExpert is absolutely amazing, if you try algo expert once you will be fan of it
He recommends me type script just when I wanted to go through a 10 javascript app making tutorial
Here from codingphase. :) Glad he helped us find your channel. This is dope!
got an algoexpert ad before this video lol
1:51 We also love America ❤️❤️❤️❤️❤️
yes we do, america should give more visa.
Oh man you're a legend I hope someday you spread the treasure of knowledge you have and, start making educational series on your channel :)
MPJ from FunFunFunction doesn't agree with you about the benefits of TypeScript. Exactly what issues did you run into that TS would've nullified? I assume it has something to do with using the correct type.
have nothing specific to comment, but still I am commenting because "it helps with the youtube algorithm".
Flavors of frontend.
Thanks to Rachit and Gaurav !!
Thanks Clement for everything you teach!
This is helpful when it comes to web app design. I’m looking forward to more of your videos
Want to see the code base of arranging the questions...
Me too!!!!
Hey Clement, which react UI library do you use? Great videos, keep up the good work
Bet it's pure CSS/SCSS stuff
No libraries! We have a few bootstrap components that we’re trying to get rid of, but that’s about it. Oh and we use ReactTooltip actually!
@@clem Impressive, the design looks pretty good, consistent and responsive, well done
Very insightful...thanks !
Love from India ❤️
Clement I love your presprctive on many things keep the good work