Arshad Ali Soomroarshadalisoomro.hashnode.net·Mar 29, 2023Adding Material UI to Next.js TypeScriptMui is a popular UI component library for React that provides pre-made components such as buttons, forms, and modals. In this article, we will be discussing how to add Mui v5 to Next.js using TypeScript. Install Dependencies First, you need to instal...Discuss·11 likes·39 readsEmployee Leave Managermui
Arshad Ali Soomroarshadalisoomro.hashnode.net·Apr 7, 2023Creating a Navigation Bar with MUI AppBar Component in Next.jsThe App Bar displays information and actions relating to the current screen. The top App bar provides content and actions related to the current screen. It's used for branding, screen titles, navigation, and actions. It can transform into a context...Discuss·5 likesEmployee Leave Managermui-next.js
Alam Jamalalamjamal.hashnode.net·Mar 2, 2023React MUI Select All Checkbox With Simple LogicSelecting multiple items from a list is a common feature in many web applications. Often, users need to select all items in the list, instead of selecting them one by one. This is where the "Select All" checkbox comes in handy. In this article, we wi...Discuss·1 like·96 readsJavaScript
Arshad Ali Soomroarshadalisoomro.hashnode.net·Apr 7, 2023Creating a Navigation Bar with MUI AppBar Component in Next.jsThe App Bar displays information and actions relating to the current screen. The top App bar provides content and actions related to the current screen. It's used for branding, screen titles, navigation, and actions. It can transform into a context...Discuss·5 likesEmployee Leave Managermui-next.js
Arshad Ali Soomroarshadalisoomro.hashnode.net·Mar 29, 2023Adding Material UI to Next.js TypeScriptMui is a popular UI component library for React that provides pre-made components such as buttons, forms, and modals. In this article, we will be discussing how to add Mui v5 to Next.js using TypeScript. Install Dependencies First, you need to instal...Discuss·11 likes·39 readsEmployee Leave Managermui
Success Godswill Chibuzogodswillch.hashnode.net·Mar 28, 2023How to conditionally Render status (Pending or Verified) on MUI table in React.js.MUI Table is a component of the Material-UI library that provides a flexible and customizable way to display tabular data in web applications. It offers a wide range of features and customization options to suit different use cases. One of the primar...DiscussReact
Arshad Ali Soomroarshadalisoomro.hashnode.net·Mar 28, 2023Creating Next.js AppCreating a web application using Next.js and Yarn is an excellent way to build fast and scalable web apps. Next.js is a React-based framework that offers server-side rendering (SSR), automatic code splitting, and optimized performance out-of-the-box....Discuss·1 like·35 readsEmployee Leave ManagerNext.js
ClarenceforOpen Replay's Technical Blogopenreplay.hashnode.net·Mar 9, 2023Display Data with Material UI's Data GridAs web developers, we may frequently be required to display large volumes of data on a website, with functionalities such as editing, selection, pagination, export, sorting, selecting, and filtering data, which is an effective way to manage multiple ...Discuss·85 readsReact
Alam Jamalalamjamal.hashnode.net·Mar 2, 2023React MUI Select All Checkbox With Simple LogicSelecting multiple items from a list is a common feature in many web applications. Often, users need to select all items in the list, instead of selecting them one by one. This is where the "Select All" checkbox comes in handy. In this article, we wi...Discuss·1 like·96 readsJavaScript
Alam Jamalalamjamal.hashnode.net·Mar 1, 2023React Formik MUI Reusable Component SignUp FormReact Formik is a library that makes it easier to work with forms in React applications. Material-UI (MUI) is a popular React component library for creating beautiful user interfaces. Together, they can be used to create reusable component forms. To ...Discuss·76 readsJavaScript
Mridul Pandamriduls.hashnode.net·Feb 28, 2023Top 5 React Icon Library to Enhance Your Web AppIcons are an essential part of any web application. They make the UI/UX more engaging, improve user navigation, and add a professional touch to the website. React icon libraries are the best way to add icons to your web application. They offer a wide...Discuss·37 readsReact
Rorybronz3beard.hashnode.net·Dec 10, 2022Adding custom location markers to mapboxThe first thing I want to point out is, working with mapbox is very enjoyable, the docs are great, and there are tons of resources to learn from and work with. This is a small part of my experience working with mapbox, here is the little web app Info...Discuss·111 readsmapbox
Venkataramanavrlj.hashnode.net·Oct 31, 2022Creating Global Lodaers and Alerts in React AppThe 2 most common types of UI presentations to be shown are loaders and alerts/notifications. So it makes sense to add these 2 as global components and then trigger then as and when required. They usually have the same UI throughout the app except fo...Discuss·30 readsmui
