- 84
- 84 870
Frontend with Syket
United States
Приєднався 8 тра 2020
I'm Syket Bhattacherjee, a Software Engineer at CreoWis. On this channel, I'll share the knowledge and experience I've gained in the tech industry over the years. I'm committed to making your subscription worthwhile and delivering valuable content. Your support means a lot to me, and I promise to make it worthwhile. Thank you for joining me on this journey!
Partnership Inquiry / Sponsorship Inquiry: syketweb@gmail.com
Partnership Inquiry / Sponsorship Inquiry: syketweb@gmail.com
React Compound Components | React Interview Questions
#react #designpatterns #reactinterview
Hi, I'm Syket Bhattachergee, and in this video, we'll explore compound components in React, a powerful design pattern every React developer should know. Compound components allow you to break down a larger component into smaller, reusable sub-components that work seamlessly together. By using React's context API, you can easily share data between these components, creating modular, flexible, and reusable components across your entire app. Stay tuned as we dive into how compound components can boost your React development workflow and make your code more maintainable and scalable.
Follow me on LinkedIn: www.linkedin.com/in/syketb/
React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
React Compound Components | React Interview Questions
The Real Difference Between Functional and Class Components in React
The Surprising Truth About Compound Components Nobody Tells You
Compound Components in React Showdown Functional vs Class
You Won't Believe the Power of Compound Components in React
Experts Agree Compound Components Are the Future of React Development
I Spent 100 Hours Mastering Compound Components in React and Here's What I Learned
The Real Difference Between Functional and Compound Components for React Developers
5 Compound Component Hacks to Boost Your React App Performance Overnight
react tutorial,react crash course,react developer,learn react,react hook,react hooks,react hooks tutorial,programming tutorial,react hooks explained,computer science,tutorial for beginners,react component,learn programming,web development,frontend development,coding for beginners,simple code,easy programming,react,react native,react design patterns,akshay saini javascript,akshay saini react interview,akshay saini react,react tutorial for beginners
Hi, I'm Syket Bhattachergee, and in this video, we'll explore compound components in React, a powerful design pattern every React developer should know. Compound components allow you to break down a larger component into smaller, reusable sub-components that work seamlessly together. By using React's context API, you can easily share data between these components, creating modular, flexible, and reusable components across your entire app. Stay tuned as we dive into how compound components can boost your React development workflow and make your code more maintainable and scalable.
Follow me on LinkedIn: www.linkedin.com/in/syketb/
React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
React Compound Components | React Interview Questions
The Real Difference Between Functional and Class Components in React
The Surprising Truth About Compound Components Nobody Tells You
Compound Components in React Showdown Functional vs Class
You Won't Believe the Power of Compound Components in React
Experts Agree Compound Components Are the Future of React Development
I Spent 100 Hours Mastering Compound Components in React and Here's What I Learned
The Real Difference Between Functional and Compound Components for React Developers
5 Compound Component Hacks to Boost Your React App Performance Overnight
react tutorial,react crash course,react developer,learn react,react hook,react hooks,react hooks tutorial,programming tutorial,react hooks explained,computer science,tutorial for beginners,react component,learn programming,web development,frontend development,coding for beginners,simple code,easy programming,react,react native,react design patterns,akshay saini javascript,akshay saini react interview,akshay saini react,react tutorial for beginners
Переглядів: 1 623
Відео
React Virtualized List | Efficiently Render 100,000 Rows in React
Переглядів 69414 днів тому
#reactjs #virtualization #frontenddevelopment Hi there, I am Syket Bhattachergee from Frontend with syket, Today we will experiment with Reactjs and see how we can make React capable of rendering 100 thousand rows at the same time using virtualization. Code: codesandbox.io/p/sandbox/frontend-with-syket-virtualized-list-8yl8c6 Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview...
Master Socket.io and React - Build Full Stack Chat App with React
Переглядів 10721 день тому
#react #socketio #chatapp #express Learn Socket.io and React in 1 Hour. Learn How To Make a Real-time Full Stack chat app using React JS, Socket.io, Express, and Chakra UI. Create your own chat application step-by-step tutorial 2024. Unlock the secrets of mastering Socket.io and React with this comprehensive guide to building a real-time chat app. Learn expert techniques, essential tools, and t...
TanStack Table (React Table) Crash Course in 40 mins - Beginners Tutorial
Переглядів 1,6 тис.Місяць тому
#reacttable #tanstacktable #tanstack Master TanStack Table in 40 mins. A comprehensive tutorial on TanStack React Table, the ultimate solution for creating powerful and interactive data tables in your React applications! In this in-depth video, we will take you through all the essential concepts and features of TanStack React Table, empowering you to effortlessly manage and visualize data like ...
I Got Remote Developer Job Using LinkedIn | Tips for Job Seekers!
Переглядів 3142 місяці тому
#developerjobs #LinkedInTips #TechCareers #JobSearch2024 #CodingCareers Discover the insider strategies I used to secure a developer job through LinkedIn in 2024. This video covers profile optimization, networking techniques, and interview preparation tips that helped me stand out in a competitive job market. Whether you're a coding bootcamp graduate or an experienced programmer looking for a c...
React Stepper | Multistep Form | React Interview Questions | Machine Coding Round
Переглядів 3122 місяці тому
#react #reactinterview Let's create a react stepper form. Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html React Stepper | Multistep Form | React Interview Questions | Machine Coding Round MIND-BLOWING React Interview Questions EXPOSED! The SHOCKING Truth About Machine Coding Round Exposed The React Stepper SECRET to Acing M...
Top 5 React Concepts Explained in 10 Minutes
Переглядів 792 місяці тому
#reactjs #reactjsforbeginners Learn the most important concepts of React JS in a simple and easy manner. Top 5 React Concepts Explained in 10 Minutes Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html This video context is similar to this title: React Tutorial for Beginners React JS Explained In 10 Minutes React Crash Course 2...
5 useState & useEffect Mistakes Mid React Developers Still Make in 2024
Переглядів 4342 місяці тому
5 common mistakes React developers still make with useState and useEffect in 2024. Learn best practices to avoid these errors, improve your React code, and level up from junior to senior developer. Perfect for those starting with React or looking to refine their skills. React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html Follow me on LinkedIn: www.linkedin.com/in/syketb/ Join o...
React JS Infinite Scroll | React Interview Questions | Machine Coding Round
Переглядів 1,1 тис.2 місяці тому
#reactjs #scroll #beginners Welcome! In this video, we'll show you how to add infinite scroll with React JS. Infinite scroll is a mechanism that dynamically loads data as needed, ensuring optimal performance by avoiding critical issues. This feature is especially common in social media applications, but it can be intimidating to set up. We'll break down the process, making it clear that setting...
React Video Call App | React Beginner Projects & Portfolio | ZEGOCLOUD
Переглядів 4742 місяці тому
#zegocloud #videocall #webrtc #sdk #api Get 10000 free mins with UIKits: bit.ly/4ff8TAF Learn more about ZEGOCLOUD: bit.ly/4cUERjU How to build a video call App: bit.ly/4ft0ARY ZEGOCLOUD video call SDK &API allows you to easily build live video chat apps within minutes. Hey Everyone, we will build our own one-on-one video calling application using React and Zegocloud in this video. Connect with...
React Toast | React Interview Questions | Machine Coding Round | Frontend
Переглядів 7713 місяці тому
#reactjs #javascript #notification #toast #toastify In this tutorial, we'll show you how to create a Toast component in React-a common interview question. Follow our step-by-step instructions to implement a fully functional Toast component. Plus, gain valuable tips and tricks to tackle React JS and JavaScript questions in frontend coding interviews. Whether you're a beginner or looking to refin...
React OTP Input | Machine Coding Round | React JS Interview Questions | Frontend
Переглядів 2,3 тис.3 місяці тому
#reactjs #reacthooks #coding #javascript #otplogin #otp #login Are you preparing for a frontend react machine coding interview? Look no further! In this video, we'll guide you through creating an OTP input in React, one of the most frequently asked interview questions. Learn how to implement an OTP login feature with step-by-step instructions and gain valuable tips and tricks to tackle your Rea...
React Pagination | React Interview Questions | Machine Coding Round
Переглядів 1,1 тис.3 місяці тому
#react #JavascriptInterview #javascript Hey everyone, In this video I have shared a React Pagination Component machine coding interview that was asked to one of my friends recently. Source Code: github.com/syket-git/react-pagination Connect with me 1:1 on Discord: discord.gg/2H7NkZbN Follow me on Linkedin: www.linkedin.com/in/syketb/ react interview questions,frontend interview questions,front ...
Are You Making This Common SOLID Design Principles Mistake in React Interviews?
Переглядів 4483 місяці тому
Are You Making This Common SOLID Design Principles Mistake in React Interviews?
React JS Machine Coding ( Timer App ) - Frontend Machine Coding Interview Questions
Переглядів 9073 місяці тому
React JS Machine Coding ( Timer App ) - Frontend Machine Coding Interview Questions
You are DONE with CODE... GitHub Copilot X with GPT4
Переглядів 129Рік тому
You are DONE with CODE... GitHub Copilot X with GPT4
How I made a Game in just 10 minutes 😱 with ChatGPT and JavaScript
Переглядів 80Рік тому
How I made a Game in just 10 minutes 😱 with ChatGPT and JavaScript
useState vs useReducer in React JS | useState or useReducer | React Hooks Tutorial #react
Переглядів 191Рік тому
useState vs useReducer in React JS | useState or useReducer | React Hooks Tutorial #react
5 JavaScript Coding Hacks to Increase Code Quality
Переглядів 66Рік тому
5 JavaScript Coding Hacks to Increase Code Quality
TOP 5 CSS Interview Questions in 2023 || CSS Interview Questions
Переглядів 232Рік тому
TOP 5 CSS Interview Questions in 2023 || CSS Interview Questions
Learn React Props in 5 Minutes | React JS Props
Переглядів 229Рік тому
Learn React Props in 5 Minutes | React JS Props
Expert Next JS by Building Real Projects with Tailwind CSS #Part-10
Переглядів 66Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-10
Expert Next JS by Building Real Projects with Tailwind CSS #Part-9
Переглядів 70Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-9
Expert Next JS by Building Real Projects with Tailwind CSS #Part-8
Переглядів 77Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-8
Expert Next JS by Building Real Projects with Tailwind CSS #Part-7
Переглядів 59Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-7
Expert Next JS by Building Real Projects with Tailwind CSS #Part-6
Переглядів 74Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-6
Expert Next JS by Building Real Projects with Tailwind CSS #Part-5
Переглядів 97Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-5
Expert Next JS by Building Real Projects with Tailwind CSS #Part-4
Переглядів 81Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-4
Expert Next JS by Building Real Projects with Tailwind CSS #Part-3
Переглядів 111Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-3
Expert Next JS by Building Real Projects with Tailwind CSS #Part-2
Переглядів 137Рік тому
Expert Next JS by Building Real Projects with Tailwind CSS #Part-2
i think you didnt use pagination correctly, choosing 5 and its displaying 7 rows
dude learn TS please
Assalomu alaykum. Bro items per page does not work in your react table project
where can I find this code ? any github url ? thanks for this video.
Here it is: codesandbox.io/p/sandbox/frontend-with-syket-virtualized-list-8yl8c6
It's not easy to consume also, need to import dropdown, dropdown list and other components.
I might have misunderstood your question, but here’s my thought: With the freedom we now have, we have complete control over the child component. This allows us to make any customizations we need. If I understood your question correctly, this should address it.
@@syketb I just wanted to say that for developers wanting to use the dropdown component, it's not easy they need to import several child components also, which makes the process little complicated.
good work sir🙏🙏🙏🙏
Thank you <3
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
This triggered my OCD!😂 Can you just deal with the error messages first😢
Error messages, what did you meant? Could you please elaborate your question?
@@syketb The output on the browser was complaining that useRef was undeclared because you had not imported it. But you ignored that error for like 8-10 minutes. which was torture for some people like me. I know its not a big deal but if you have OCD it is a big deal. Anyway, I survived the torture and finished the video. So, thanks for the tutorial.
I'm really sorry about that. I'll definitely keep it in mind for my next tutorial. Sometimes, I focus too much on certain topics to explain them clearly, but I'll make sure to avoid that in the future. Thanks for your feedback!
Start from 8:00
why didn't you use react window? it takes literally 3 minutes.
Bro, I liked your suggestion! The goal is, if your lead doesn’t support using third-party libraries, or if interviewers ask you to implement a React virtualized list that can handle thousands of items, this was my main goal-to solve that issue.
@@syketbexactly I was asked a interview question as to how to convince teammates not to use external libraries
@@chandrashekark5382 Exactly, in large, secure applications, the engineering team often avoids adding third-party npm libraries due to security concerns or potential performance issues.
❤❤❤❤❤❤
Thanks for your support
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
extention name pls
Which one, you are looking for?
@@syketb The font has been changed
@@hellobear. I am using "Dank Mono" font
@@syketb thanks
The pagination part didn't work for me. I even took your code from github but it didn't work. (For example, when I choose number 5, the number of pages changes, but it shows all the rows on the page)
Hey I would love to debug your code, please share the link of your repo.
@@syketb Thanks for following up. ❤ Fortunately, my problem was solved
@@YasinAghazyarati Amazing, good to hear
The best TanStack Table course that I find. and a question: what's your theme and font name in VScode?
Hey Yasin First of all thanks man, I love to hear that from you. Theme: Dark Magic Theme Font: Dank Mono
@@syketb good luck bro
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
thanks i found a good channel to learn the basic concept of react table
Great to hear!
bhai need your help
Yes please tell me, how can i help you
Thanks for this, I used Tanstack Table last month with ShadCN but i think i need a refresher. Especially as I'm not using shadCN in my current project. This tutorial is apt! Thanks!
Glad it was helpful! Thanks
Bro code link?
github.com/syket-git/react-table
You are great bro
<3
@@syketb Just bro can you tell me how to add animation in it please make a video on it and accessibility also 👍🏻
@@jawadrashid1000 Bro its straight forward you can use tailwind animation or just plain CSS.
@@syketb ok thanks 👍🏻
can use tanstack load newest data from API and running in background?
Yes definitely we could, see the data I am getting from the JSON file, it's the same as you can get it from API calls.
@syketb I'm using rest api and must be add loading screen for block for refresh field and hit again for all table if using tanstact we can just retrieve 1 field updated?
@@muhammadabduhsiregar9190 I didn't get "we can just retrive 1 field updated?" means.
@syketb just get 1 column of data for updated, maybe like button refresh progress for need newest data
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
bro.. whats the theme?
Dark Magic Themes
@@syketb thanks 🙏🏻
Can u also add these topics in your videos for machine coding ? 1) Nested comments 2) File explorer with create , edit , delete functionality 3) Custom table with search , sort functionality in columns 4) Dropdown menu with search functionality
Hey, it’s great to see your suggestions! I’d love to add them. Thanks!
*expected content
Thanks, will get more related on this.
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
Follow me on LinkedIn: www.linkedin.com/in/syketb/ React JS Interview playlist: ua-cam.com/video/N7dX1vXhcI8/v-deo.html
You did great bro. Nice video
Thanks man, you liked it. great to see.
useful content.
Glad to hear that, tamzid
Can you add check boxes redio button, select drop down so it will be more useful in this context
Hey Pritam, thanks for suggestion will keep in mind.
Bro, discord link is invalid.
Yes i got to know discord allowed invitation link for a certain period after then it will automatic expired.
You made it so clear. Thanks, man!🤝
Hey man, this is my satisfaction. Thanks!