<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: UI Lib</title>
    <description>The latest articles on Forem by UI Lib (@uilibofficial).</description>
    <link>https://forem.com/uilibofficial</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F702117%2F8ce603da-7796-4ce1-b59a-812600af2217.jpg</url>
      <title>Forem: UI Lib</title>
      <link>https://forem.com/uilibofficial</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/uilibofficial"/>
    <language>en</language>
    <item>
      <title>Best React Next.js eCommerce Template! 🛒 - 55+ Server-Side Rendered Demos &amp; Pages🤯😍</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Mon, 08 Aug 2022 08:09:00 +0000</pubDate>
      <link>https://forem.com/uilibofficial/best-react-nextjs-ecommerce-template-55-server-side-rendered-demos-pages-528h</link>
      <guid>https://forem.com/uilibofficial/best-react-nextjs-ecommerce-template-55-server-side-rendered-demos-pages-528h</guid>
      <description>&lt;p&gt;Originally Published at &lt;a href="https://mui.com/store/items/bazar-pro-react-ecommerce-template/"&gt;MUI Store&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Bazar Pro is a powerful &amp;amp; comprehensive multipurpose React Next.js eCommerce template with an elegant design and unique home pages. A carefully crafted &amp;amp; professional, mobile-friendly, server-side rendered eCommerce template that is production-ready. It's clean and the codebase is simple and straightforward. Also, it is built with Material UI, one of the top User Interface libraries for React.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://mui.com/store/previews/bazar-pro-react-ecommerce-template/"&gt;Live Preview&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;&lt;a href="https://mui.com/store/items/bazar-pro-react-ecommerce-template/"&gt;Details / Download&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Resources&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;JavaScript (all licenses)&lt;br&gt;
TypeScript (plus &amp;amp; extended licenses)&lt;br&gt;
Figma file (plus &amp;amp; extended licenses)(&lt;a href="https://www.figma.com/file/mJkRaRDlAn9ZX9rZxsDdNH/Bazaar-v3.0.0-for-MUI-Customers?node-id=275%3A258"&gt;Preview Figma&lt;/a&gt;)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Features&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;MUI Core v5&lt;/li&gt;
&lt;li&gt;Next.js v12&lt;/li&gt;
&lt;li&gt;Multiple home pages&lt;/li&gt;
&lt;li&gt;Multi-vendor pages&lt;/li&gt;
&lt;li&gt;RTL support&lt;/li&gt;
&lt;li&gt;Optimized for mobile &amp;amp; performance&lt;/li&gt;
&lt;li&gt;Admin/vendor dashboard&lt;/li&gt;
&lt;li&gt;Fully responsive design&lt;/li&gt;
&lt;li&gt;User account dashboard&lt;/li&gt;
&lt;li&gt;React hooks&lt;/li&gt;
&lt;li&gt;Lazy image loading&lt;/li&gt;
&lt;li&gt;Formik&lt;/li&gt;
&lt;li&gt;Chartjs&lt;/li&gt;
&lt;li&gt;SEO friendly&lt;/li&gt;
&lt;li&gt;Server Side Rendered&lt;/li&gt;
&lt;li&gt;Clean Code&lt;/li&gt;
&lt;li&gt;Figma Ready&lt;/li&gt;
&lt;li&gt;Easy to customize&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pages&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/"&gt;Super Store&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/grocery1"&gt;Grocery 1&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/grocery2"&gt;Grocery 2&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/grocery3"&gt;Grocery 3&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/sale-page-1"&gt;Sale page 1&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/sale-page-2"&gt;Sale page 2&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/shops"&gt;All Vendors&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/shops/34324"&gt;Vendor Store&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/product/search/mobile%20phone"&gt;Search Product&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/product/34324321"&gt;Single Product&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/cart"&gt;Cart&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/checkout"&gt;Checkout&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/checkout-alternative"&gt;Alternative Checkout&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/orders/5452423"&gt;Order Details&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/orders"&gt;Oder List&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/profile/edit"&gt;Edit Profile&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/profile"&gt;View Profile&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/address"&gt;Add Address&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/address"&gt;Address List&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/support-tickets"&gt;All tickets&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/support-tickets/512474"&gt;Ticket details&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/wish-list"&gt;Wishlist&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/vendor/dashboard"&gt;Dashboards&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/products"&gt;Products&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/products/create"&gt;Add/Edit Products&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/categories"&gt;Categories&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/brands"&gt;Brands&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/product-reviews"&gt;Reviews&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bazar-react.vercel.app/admin/orders"&gt;All orders&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/orders/1"&gt;Order Details&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/customers"&gt;Customers&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/customers"&gt;Refund Requests&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/refund-request"&gt;Refund Settings&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/sellers"&gt;Seller List&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/seller-package"&gt;Seller packages&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/package-payment"&gt;Package payments&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/earning-history"&gt;Earning History&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/payouts"&gt;Payouts&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/payout-request"&gt;Payout requests&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/vendor/earning-history"&gt;Earning History&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/admin/payouts"&gt;Payouts&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/vendor/payout-settings"&gt;Payout Settings&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/vendor/shop-settings"&gt;Shop Settings&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/vendor/site-settings"&gt;Site Settings&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/vendor/account-setting"&gt;Profile&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://bazar-react.vercel.app/signup"&gt;Sign Up&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Documentation&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Browse &lt;a href="https://bazar-doc.netlify.app/"&gt;Documentation&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Updates and support&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Purchasing a license gives you access to:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;1 year of free updates&lt;/li&gt;
&lt;li&gt;6 months of technical support&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Need support? &lt;a href="https://support.ui-lib.com/"&gt;Create a ticket&lt;/a&gt; or send us an email at &lt;a href="//support@ui-lib.com"&gt;support@ui-lib.com&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>react</category>
      <category>ecommerce</category>
      <category>materialui</category>
      <category>dashboard</category>
    </item>
    <item>
      <title>10 Best Angular 14 Admin Templates in 2022</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Thu, 04 Aug 2022 13:02:00 +0000</pubDate>
      <link>https://forem.com/uilibofficial/10-best-angular-14-admin-templates-in-2022-1c6a</link>
      <guid>https://forem.com/uilibofficial/10-best-angular-14-admin-templates-in-2022-1c6a</guid>
      <description>&lt;p&gt;Are you looking for some of the best Angular 14 Admin Templates of 2022? Look no further! In this blog, we will be showcasing to you our top picks for the best Angular 14 Admin Templates in 2022. &lt;/p&gt;

&lt;p&gt;You probably know that Angular frequently updates the framework. And, sometimes it's hard to keep up with their fast pace development. However, our today's picks will let you enjoy Angular's most recent version. Your project can start off strong with Angular. Once your application is complete, you can reuse the code in future projects or give it to other programmers. You can now concentrate on creating your app rather than writing complex code, which is a great news for developers. &lt;/p&gt;

&lt;h2&gt;Best Angular 14 Admin Templates&lt;/h2&gt;

&lt;p&gt;Before we jump into this awesome list of Angular 14 Admin Templates, please note that the list is in no particular order. So, feel free to check out and go through any of these templates. All of them are above average &amp;amp; up-to-date.  &lt;/p&gt;

&lt;h2 id="h-egret-angular-14-material-design-admin-dashboard-template"&gt;Egret - Angular 14+ Material Design Admin Dashboard Template&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F06%2FEgret-Angular-Material-Design-Admin-template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F06%2FEgret-Angular-Material-Design-Admin-template.png" alt="egret angular material design admin template"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Egret is one of the most promising Pure Typescript Angular 14+ Material Design Admin Templates with Flex Layout and Angular CLI. It comes with a large collection of responsive, reusable components and has NO jQuery, and No Bootstrap. If you're looking for an ERP, CRM, or CMS admin template to start your project, Egret can be your go-to option. &lt;/p&gt;

&lt;p&gt;The template contains a wide range of features including multiple layouts, lazy loading, dynamic breadcrumbs, page titles, model-driven dynamic navigation, and multi-language support. Moreover, it has 2 prebuilt themes, Light &amp;amp; Dark mode, easy customization, and a lot more.   &lt;/p&gt;

&lt;p&gt;Since its launch, Egret has received huge customer support &amp;amp; &lt;a href="https://themeforest.net/item/egret-angular-4-material-design-admin-template/reviews/20161805?utf8=%E2%9C%93&amp;amp;reviews_controls%5Bsort%5D=ratings_descending" rel="noreferrer noopener"&gt;excellent reviews&lt;/a&gt;. And, it was even featured by the &lt;a href="https://themeforest.net/user/ui-lib/portfolio" rel="noreferrer noopener"&gt;Themeforest Marketplace&lt;/a&gt; also. So, make sure to check out &lt;strong&gt;Egret&lt;/strong&gt; before moving on to our next selection for the best Angular 14 Admin Templates. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/JN1r7" rel="noreferrer noopener"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;      &lt;strong&gt;&lt;a href="https://themeforest.net/item/egret-angular-4-material-design-admin-template/full_screen_preview/20161805?_ga=2.72627219.1017326301.1659510119-1627266193.1659510119" rel="noreferrer noopener"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt;     &lt;/p&gt;

&lt;h2 id="h-gull-angular-14-admin-template-with-bootstrap-5"&gt;Gull - Angular 14+ Admin Template with Bootstrap 5&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F06%2Fgull-angular-admin-template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F06%2Fgull-angular-admin-template.png" alt="gull angular admin template"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Gull is another outstanding Angular 14+ Admin Template by UI-Lib with Bootstrap 5. It is a highly customizable template with so many useful features like full SASS support, pre-built apps, Angular Compatible UI Kits, customizable color schemes, Auth Guard, Data Table, and more.&lt;/p&gt;

&lt;p&gt;The template uses NG Bootstrap, 3rd party NGX packages, and supports AOT compilation. Furthermore, it has dynamic model-driven navigation, full-screen search, 2000+ premium iconsmind icons, etc. Also, here you'll find web application backends such as a custom admin panel, 4 dashboard variations, accounting software, chat app, calendar schedule app, eCommerce backends, CMS, CRM, ERP, or SaaS.&lt;/p&gt;

&lt;p&gt;The Gull template is a feature-loaded admin template that aims to make the Angular developer's life easier. Find out the rest of its potential from the buttons below.  &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/7mdxQO" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;     &lt;strong&gt;&lt;a href="https://themeforest.net/item/gull-angular-bootstrap-admin-dashboard-template/full_screen_preview/22866096?_ga=2.34763553.1017326301.1659510119-1627266193.1659510119" rel="noreferrer noopener"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h2 id="h-noa-angular-14-admin-dashboard-template"&gt;NOA - Angular 14 Admin Dashboard Template&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FNoa-Angular-Admin-Template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FNoa-Angular-Admin-Template.png" alt="NOA - Angular Admin Template"&gt;&lt;/a&gt;&lt;/p&gt;



&lt;p&gt;NOA - is a beautiful, clean, and high-quality Angular Bootstrap 5 admin and dashboard template that has both Dark and Light Layouts. Also, it is a fully-responsive design with which you can build any type of online application. The application possibilities include admin panels and SaaS-based user interfaces. &lt;/p&gt;

&lt;p&gt;The template includes a myriad of features that will be extremely useful for developers who need to get their project up and running quickly or those who want to focus solely on creating a fully functional admin panel for running their businesses smoothly.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/XxaOVb" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;     &lt;strong&gt;&lt;a href="https://preview.themeforest.net/item/noa-angular-admin-dashboard-template/full_screen_preview/38959243?_ga=2.13335223.1017326301.1659510119-1627266193.1659510119" rel="noreferrer noopener"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h2 id="h-modern-admin-angular-14-bootstrap-4-admin-dashboard-template"&gt;Modern Admin - Angular 14+ Bootstrap 4 Admin Dashboard Template&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2Fmodern-admin-angular-template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2Fmodern-admin-angular-template.png" alt="modern admin"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Modern Admin is an Angular 14+, Angular CLI + Ng Bootstrap, Workable Apps, and AOT Compatible angular admin dashboard template. It is also a super customizable template with a truckload of features that can bolster your admin panel development process. &lt;/p&gt;

&lt;p&gt;This innovative admin template can help you create eye-catching, high-quality, and high-performing single-page applications. Your apps will be completely responsive, ensuring that they look great and work perfectly on desktops, tablets, and mobile devices.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/QO94ox" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;     &lt;strong&gt;&lt;a href="https://modernadmin.evolvision.com/dashboard/sales" rel="noreferrer noopener nofollow"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt; &lt;/p&gt;

&lt;h2 id="h-startng-angular-14-admin-template-with-bootstrap-4"&gt;StartNG - Angular 14 Admin Template with Bootstrap 4&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FStartNG-Angular-14-Admin-Template-with-Bootstrap-4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FStartNG-Angular-14-Admin-Template-with-Bootstrap-4.png" alt="StartNG - Angular Admin template with bootstrap 4"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;StartNG - is an innovative admin template built on the Bootstrap 4 framework and Angular 14 technology. It's quite simple to maintain when using such fantastic tools as Angular-CLI. On every device and in any contemporary browser, it is clear and completely responsive. The code is very simple to grasp. Also, it allows any Angular developer the ability to transform this template into a functional web application.&lt;/p&gt;

&lt;p&gt;It has numerous sample pages that are easy to customize and have many ready-to-use features. There are a few ready-made layouts from which to choose. The quantity of components offered by frameworks like Bootstrap is generally insufficient to create a functioning project. The template includes a variety of well-liked UI elements, a common color scheme, and more.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/WDeRnZ" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;      &lt;strong&gt;&lt;a href="http://preview.themeforest.net/item/startng-angular-4-admin-template-with-bootstrap-4/full_screen_preview/20191721" rel="noreferrer noopener nofollow"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt; &lt;/p&gt;

&lt;h2 id="h-azimuth"&gt;Azimuth &lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FAzimuth-Angular-14-Admin-Template-with-Bootstrap-4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FAzimuth-Angular-14-Admin-Template-with-Bootstrap-4.png" alt="azimuth"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The innovative front-end admin dashboard template Azimuth is built on Bootstrap 4 and Angular 14. This implies that all of the data you see on graphs, charts, and tables is a Javascript mockup. Thus, there are no restrictions on your use of the backend of your choosing.&lt;/p&gt;

&lt;p&gt;Angular-CLI, Bootstrap 4, lazy loading routes, nested routing, an Angular dynamic menu, and other capabilities are available in the template. Be sure to have a look at Azimuth.&lt;/p&gt;

&lt;p id="h-"&gt;&lt;a href="https://1.envato.market/ORD42r" rel="noreferrer noopener sponsored nofollow"&gt;&lt;strong&gt;Details / Download&lt;/strong&gt;&lt;/a&gt;      &lt;strong&gt;&lt;a href="http://preview.themeforest.net/item/azimuth-angular-2-admin-template/full_screen_preview/19182105" rel="noreferrer noopener nofollow"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h2 id="h-endless-angular-14-admin-template"&gt;Endless - Angular 14 Admin Template&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FEndless-Angular-14-Admin-Template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FEndless-Angular-14-Admin-Template.png" alt="endless angular admin template"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Yes, Endless Angular Theme is a pure Angular 14+ theme! You read that correctly. It's a No Jquery Angular Admin Theme with all features and functionality for your project's ease of integration. Endless theme document will assist you in learning Angular from the ground up to create a perfect real-time dream application.&lt;/p&gt;

&lt;p&gt;The Endless Angular theme includes useful features such as No jQuery, an appealing dashboard, easy customization, light and dark theme options, RTL support, a responsive layout, and so on.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/Ke64ny" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;       &lt;strong&gt;&lt;a href="https://preview.themeforest.net/item/endless-angular-admin-template/full_screen_preview/23884779" rel="noreferrer noopener nofollow"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt; &lt;/p&gt;

&lt;h2 id="h-vex"&gt;Vex &lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FVex-Angular-14-Material-Design-Admin-Template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FVex-Angular-14-Material-Design-Admin-Template.png" alt="vex angular admin template"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Vex is an Angular 14 admin template. It develops the elements of Material Design. You have all you need in the template to start your subsequent CRM, CMS, or dashboard-based project.&lt;/p&gt;

&lt;p&gt;It offers a simple customization choice. Also, navigation menu items can be dynamically added. You can edit each page with ease. Furthermore, the Angular-CLI makes it simple to create new pages simply by building a component.&lt;/p&gt;

&lt;p&gt;Light and Dark modes, various charts, Google Maps integration, etc. are just a few of Vex's features.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/5b01Xn" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;      &lt;strong&gt;&lt;a href="https://preview.themeforest.net/item/vex-angular-8-material-design-admin-template/full_screen_preview/24472891?_ga=2.10041397.1017326301.1659510119-1627266193.1659510119" rel="noreferrer noopener nofollow"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h2 id="h-gradus"&gt;Gradus&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FGradus-Angular-14-Material-Design-Admin-Template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2FGradus-Angular-14-Material-Design-Admin-Template.png" alt="gradus"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Gradus is an Angular 14 admin template with a strong focus on material design. It's very simple to maintain when using great tools like Angular-CLI. On every device and modern browser, the template is fully responsive and clean. The code is simple to understand and gives any developer the ability to turn this template into a real web application.&lt;/p&gt;

&lt;p&gt;It includes many example pages with many ready-to-use elements that are simple to customize. You can select from a few pre-made layouts. This theme has nested views and lazy loading routes, as well as AOT compilation and six color schemes/themes.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/9WdybQ" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;      &lt;a href="http://preview.themeforest.net/item/gradus-angular-5-material-design-admin-template/full_screen_preview/21241729" rel="noreferrer noopener nofollow"&gt;&lt;strong&gt;Live Preview&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2 id="h-lorax"&gt;Lorax &lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2Florax-angular-14-admin-template.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2022%2F08%2Florax-angular-14-admin-template.png" alt="lorax angular admin template"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Lorax is a modern admin dashboard template with a material design built with Angular 14 and the Angular-CLI. Lorax includes Angular Material UI for rich styling and design. The template includes the most recent version of Bootstrap, 5.0.1. There is no jQuery in the template. Therefore, you will get a pure angular experience.&lt;/p&gt;

&lt;p&gt;It fully supports AOT and lazy loading to accelerate your project. Lorax employs SASS to make editing the styles easier. All styles are created entirely with SASS and are simple to grasp. It includes a large number of ready-to-use components that allow you to develop quickly and easily.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://1.envato.market/x96z0k" rel="noreferrer noopener sponsored nofollow"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;       &lt;strong&gt;&lt;a href="https://preview.themeforest.net/item/lorax-angular-7-admin-dashboard-template/full_screen_preview/23430042" rel="noreferrer noopener nofollow"&gt;Live Preview&lt;/a&gt;&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Our Free Angular Admin Template - MatX Angular Admin Template&lt;/strong&gt;&lt;br&gt;
👌🥳&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqf2otxiu6q3y8i69c9xq.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqf2otxiu6q3y8i69c9xq.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://uilibrary.github.io/matx-angular" rel="noopener noreferrer"&gt;Live Preview&lt;/a&gt;&lt;br&gt;&lt;br&gt;
&lt;a href="https://ui-lib.com/downloads/matx-free-angular-material-admin-template/?edd_action=add_to_cart&amp;amp;download_id=16389" rel="noopener noreferrer"&gt;Free Download&lt;/a&gt;&lt;br&gt;
&lt;a href="https://ui-lib.com/downloads/matx-angular-dashboard-pro" rel="noopener noreferrer"&gt;Upgrade to Pro&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Similar Blogs
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://ui-lib.com/blog/angular-admin-templates/" rel="noopener noreferrer"&gt;10 Angular Admin Templates You Should Check Out in 2022&lt;/a&gt;&lt;br&gt;
&lt;a href="https://ui-lib.com/blog/how-to-choose-an-admin-template/" rel="noopener noreferrer"&gt;How To Choose An Admin Template (In 5 Simple Steps)&lt;/a&gt;&lt;/p&gt;

</description>
      <category>angular</category>
      <category>admin</category>
      <category>templates</category>
      <category>angular14</category>
    </item>
    <item>
      <title>3 Simple Ways to Connect Gumroad with WordPress Site</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Wed, 11 May 2022 12:55:42 +0000</pubDate>
      <link>https://forem.com/uilibofficial/3-simple-ways-to-connect-gumroad-with-wordpress-site-3p82</link>
      <guid>https://forem.com/uilibofficial/3-simple-ways-to-connect-gumroad-with-wordpress-site-3p82</guid>
      <description>&lt;p&gt;Are you looking for an easy solution to connect your Gumroad Page to your WordPress Site? Don’t look any further! In this blog, we will show you the top 3 simple ways to connect Gumroad with the WordPress site. But first, for those who are unfamiliar with Gumroad, let us define it simply.&lt;/p&gt;

&lt;p&gt;Gumroad is a platform where virtually anyone can sell almost anything. The process is pleasantly simple and transparent, with none of the headaches associated with some of the more popular platforms.&lt;/p&gt;

&lt;p&gt;There are more than 98,994 creators who have sold their works on this platform for over $500 million. These creators work in a variety of fields, including education, IT, music, sports, and comedy. On Gumroad, even dance and theater fans can find a home.&lt;/p&gt;

&lt;h2&gt;
  
  
  Benefits of Gumroad
&lt;/h2&gt;

&lt;p&gt;Gumroad is one of the best tools for individuals and startups looking forward to selling their products directly to customers. It gives you the access to know and understand your customers better by providing data and analytics about the product’s sales.&lt;/p&gt;

&lt;p&gt;Buying and selling products are simple for both sides, especially for non-tech people. Most importantly, the payment method is straightforward to understand. You can also sell products for no cost and collect your customers’ email addresses as assets.&lt;/p&gt;

&lt;p&gt;We know that many sellers find it challenging to implement a personal payment method system on their websites. Gumroad helps you with that.&lt;/p&gt;

&lt;p&gt;However, there are drawbacks, such as a lack of options or features. Furthermore, selling services, which are sometimes necessary and directly related to product sales, is not an option. But, for the time being, let’s put these concerns aside and concentrate on the benefits of connecting Gumroad with your WordPress site.&lt;/p&gt;

&lt;h2&gt;
  
  
  Benefits of Connecting Gumroad with Your WordPress Site
&lt;/h2&gt;

&lt;p&gt;WordPress websites are the best option for non-technical and even technical people who want to create a website quickly. They have no competitors in terms of design because thousands of designers create new designs for WordPress sites every single day. You can easily apply them to customize your WP site. According to Digitial.com, 35% of websites in the world today are WordPress websites.&lt;/p&gt;

&lt;p&gt;Moreover, WordPress also has Woocommerce for eCommerce websites. It works within WordPress to convert it into a very customizable and fully functional eCommerce site. Gumroad is fantastic, but it is limited in terms of customization. Therefore, to make your Gumroad page look the way you want it to, you must hire a developer.&lt;/p&gt;

&lt;p&gt;So, there is a constraint that you will face with Gumroad. If you integrate your Gumroad page with your WordPress or Woocommerce site, you can easily customize the design without any coding knowledge while also getting all of your products listed and structured in a proper user-friendly way. As a result, we can say that “Gumroad is good, but integrating the Gumroad page into your WordPress site is even better”.&lt;/p&gt;

&lt;p&gt;You can combine the two if you have your website and products on Gumroad. After that, you can add a link to your website from your Gumroad products page. Customers who visit your website can thus purchase products that are available on Gumroad directly from your website without having to go to Gumroad.&lt;/p&gt;

&lt;p&gt;A Gumroad page will appear when a customer clicks on a product link. They can then purchase the item or add it to their shopping cart. They can use different options if there is a selection option for them.&lt;/p&gt;

&lt;h2&gt;
  
  
  Ways to Connect Gumroad with WordPress Site
&lt;/h2&gt;

&lt;p&gt;Now, let us examine how these methods function and compare them at the end of this blog post. It is to determine which one will be the best option for you.&lt;/p&gt;

&lt;h2 id="h-1-gumpress-by-ui-lib"&gt;1. Gumpress By &lt;a href="https://ui-lib.com/"&gt;UI Li&lt;/a&gt;&lt;a href="https://ui-lib.com/" rel="noreferrer noopener"&gt;b&lt;/a&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--D3ovfEvR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://ui-lib.com/blog/wp-content/uploads/2022/02/gumpress-thumbnail.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--D3ovfEvR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://ui-lib.com/blog/wp-content/uploads/2022/02/gumpress-thumbnail.png" alt="Connect Gumroad with WordPress Site" width="880" height="407"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Gumpress is a woocommerce extension that lets you import Gumroad products into your store. It allows you to create a customized gumroad storefront using any woocommerce theme. &lt;/p&gt;

&lt;p&gt;Customers can buy your gumroad products from your woocommerce store. Gumpress replaces woocommerce's default buy button (checkout system) with the gumroad checkout popup.&lt;/p&gt;

&lt;p&gt;To update your Gumroad product, simply go to your WordPress admin panel and click "Sync Products" (product thumbnail, description, price, etc.). Furthermore, all of your products will be synced at the same time. &lt;/p&gt;

&lt;p&gt;Gumpress syncs your gumroad product versions with your woocommerce variable product. As a result, you will see a price range on your woocommerce single product page and shop page.&lt;/p&gt;

&lt;h3&gt;Main Features&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;It Imports product from Gumroad&lt;/li&gt;
&lt;li&gt;Integrate Gumroad checkout with Woocommerce&lt;/li&gt;
&lt;li&gt;Varaible product support&lt;/li&gt;
&lt;li&gt;Use any Woocommerce theme to build your Gumroad storefront&lt;/li&gt;
&lt;li&gt;Compatible with Woocommerce shortcodes (&lt;a href="https://wordpress.org/plugins/gumpress/" rel="noreferrer noopener"&gt;Details in the link&lt;/a&gt;)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://gumpress.io/demo1/"&gt;&lt;strong&gt;Demo&lt;/strong&gt;&lt;/a&gt;     &lt;strong&gt;&lt;a href="https://wordpress.org/plugins/gumpress/"&gt;Details / Download&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;2. Gumroad By &lt;a href="http://gumroad.com/" rel="noreferrer noopener"&gt;Gumroad&lt;/a&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--VQqPZ8T1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://ui-lib.com/blog/wp-content/uploads/2022/02/gumroad-with-wordpress-site.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--VQqPZ8T1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://ui-lib.com/blog/wp-content/uploads/2022/02/gumroad-with-wordpress-site.png" alt="Connect Gumroad with WordPress Site" width="880" height="403"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Gumroad is the original plugin made by Gumroad for WordPress sites. The plugin lets you embed Gumroad into your website, using Gumroad's &lt;a href="https://www.youtube.com/watch?v=u80Ey6lSRyE." rel="noreferrer noopener"&gt;&lt;strong&gt;overlay&lt;/strong&gt;&lt;/a&gt; and &lt;a href="https://gumroad.com/widgets." rel="noreferrer noopener"&gt;&lt;strong&gt;embed widgets&lt;/strong&gt;&lt;/a&gt;. If you have no coding experience no worries. It requires no coding skills. However, at the end of this blog, we will find out which one is comparatively better. &lt;/p&gt;

&lt;p&gt;Once you install the plugin to your WordPress site you don't need to worry a thing. It will automatically open the Gumroad Overlay. Means there will be a lightbox popup. If you want to know more about the plugin and how it works. make sure to watch this &lt;a href="https://www.youtube.com/watch?v=u80Ey6lSRyE." rel="noreferrer noopener"&gt;&lt;strong&gt;video&lt;/strong&gt;&lt;/a&gt;. Also, you can use &lt;a href="https://wordpress.org/plugins/gumroad/" rel="noreferrer noopener"&gt;&lt;strong&gt;shortcodes&lt;/strong&gt;&lt;/a&gt;. (You'll find them in the details section)&lt;/p&gt;

&lt;p&gt;After activating the plugin you can see the full documentation in &lt;strong&gt;Settings &amp;gt; Gumroad&lt;/strong&gt;. For &lt;strong&gt;FAQs&lt;/strong&gt; and other details click the &lt;strong&gt;'Details / Download'&lt;/strong&gt; button below. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Main Features&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Lets you embed Gumroad into your website &lt;/li&gt;
&lt;li&gt;It can appear both as a separate page and as a popup&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://wordpress.org/plugins/gumroad/" rel="noreferrer noopener"&gt;&lt;strong&gt;Details / Download&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;3. Gumroad Shortcode By &lt;a href="http://procoder.io/"&gt;Zach Silveira&lt;/a&gt;
&lt;/h2&gt;

&lt;p&gt;This plugin uses Gumroad.com's javascript modal view to integrate with them. It will include the JS required to load  Gumroad products using the shortcode on any page of your site after installation. This makes it simple to sell products on your  WordPress site using Gumroad.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Main Features&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;Uses Gumroad.com's JS modal view to integrate with them. &lt;/li&gt;&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt;&lt;code&gt;[gumroad url=”http://gum.co/tweets” title=”Specific Tweets Plugin”]&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Note:&lt;/strong&gt; The URL link above represents the link to your product page, and the title represents the link’s title.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://wordpress.org/plugins/gumroad-shortcode/" rel="noreferrer noopener"&gt;Download&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Best Option?
&lt;/h2&gt;

&lt;p&gt;Three of these plugins are completely free. Gumpress, however, is the most effective of the three. It’s because there aren’t even any shortcodes to copy and paste. All you have to do is install the plugin and add the link of your Gumroad page to it. It will load your entire Gumroad page on your WordPress site using your current design. &lt;/p&gt;

&lt;p&gt;You don’t have that option with the other two plugins. Zach Silveira’s Gumroad Shortcode hasn’t been tested with  WordPress’s most recent three major releases. As a result, there may be compatibility issues.&lt;/p&gt;

&lt;p&gt;Finally, the Gumroad plugin is not designed for Woocommerce sites. As a result, you now know which one to select. The  URL represents the link to your product page, and the title represents the link’s title.&lt;/p&gt;

&lt;h2&gt;&lt;span&gt;More Articles&lt;/span&gt;&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;a href="https://ui-lib.com/blog/what-is-web3/" rel="noreferrer noopener"&gt;Web3 – The Decentralized Web of Future&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://ui-lib.com/blog/web-app-development-trends/" rel="noreferrer noopener"&gt;Best Web App Development Trends To Look Out For&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://ui-lib.com/blog/common-web-design-mistakes-that-hurt-seo/" rel="noreferrer noopener"&gt;14 Common Web Design Mistakes That Hurt SEO&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://ui-lib.com/blog/high-converting-landing-page/" rel="noreferrer noopener"&gt;How to Make a High-Converting Landing Page&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Originally published at &lt;a href="https://ui-lib.com/"&gt;UI-Lib&lt;/a&gt; on February 20, 2022&lt;/p&gt;

</description>
      <category>wordpress</category>
      <category>woocommerce</category>
      <category>gumroad</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Laravel Nova - First Step Towards Your New CMS!</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Wed, 13 Apr 2022 10:35:32 +0000</pubDate>
      <link>https://forem.com/uilibofficial/laravel-nova-first-step-towards-your-new-cms-16pm</link>
      <guid>https://forem.com/uilibofficial/laravel-nova-first-step-towards-your-new-cms-16pm</guid>
      <description>&lt;p&gt;Laravel Nova is an administration panel that is there for you when you need a clean, elegant, and responsive admin dashboard for your web application. Creating a web application is not a piece of cake. But with Laravel... it is also not easy. &lt;/p&gt;

&lt;p&gt;Although with Laravel you will have some amazing features that will help you enjoy your ride to building a successful application. Creators of Laravel are always in pursuit of making the framework more and more developer-friendly. So they have built an awesome admin dashboard that is easy to install in your project and to get started working with.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ZNV_2UdB--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nzgyh97a2xi2xttysd8s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ZNV_2UdB--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nzgyh97a2xi2xttysd8s.png" alt="Image description" width="300" height="304"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Nova is considered a plug-and-play administration panel. It means that you just have to add it to any of your projects and it will start working. It can run CRUD functionality to any of your content types. Basically, Nova does everything that you expect from an administration panel. That is why it can be considered the first step toward your CMS.&lt;/p&gt;

&lt;h2&gt;
  
  
  Installing Laravel Nova
&lt;/h2&gt;

&lt;p&gt;First, we have to ensure the requirements before starting the installation process. The pre-requisites that we must have before installing Nova are, &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Composer&lt;/li&gt;
&lt;li&gt;Laravel Framework 8.0+&lt;/li&gt;
&lt;li&gt;Laravel Mix 6&lt;/li&gt;
&lt;li&gt;Node.js&lt;/li&gt;
&lt;li&gt;NPM&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Now for installing Laravel Nova, we first have to include Nova as a composer package repository in our &lt;code&gt;composer.json&lt;/code&gt; file,&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;"repositories": [
    {
        "type": "composer",
        "url": "https://nova.laravel.com"
    }
],
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Next, we have to add laravel/nova to our list of required packages in your &lt;code&gt;composer.json&lt;/code&gt; file:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;"require": {
    "php": "^8.0",
    "laravel/framework": "^9.0",
    "laravel/nova": "~4.0"
},
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now we should run the following command to update the composer package,&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;composer update --prefer-dist
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;To finalize the installation, the following commands should be performed,&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;php artisan nova:install

php artisan serve
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now if you don't have any Nova admin users registered you should run the following command which will create one admin user,&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;php artisan nova:user
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Features of Laravel Nova
&lt;/h2&gt;

&lt;p&gt;Nova is packed with a handful of features like,&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Resource Management&lt;/strong&gt;&lt;br&gt;
It provides a full CRUD interface for our Eloquent models. Every type of Eloquent model including pivot tables is supported.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Actions&lt;/strong&gt;&lt;br&gt;
It allows performing custom tasks in our Eloquent models which are considered actions.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Filters&lt;/strong&gt;&lt;br&gt;
It helps filter out data from Eloquent models to have a glance at a certain segment of our data table.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Lenses&lt;/strong&gt;&lt;br&gt;
If we need to customize a resource list more than the filters provide it can be easily done by lenses. Lenses help us take full control over the ELoquent queries.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Custom Tools&lt;/strong&gt;&lt;br&gt;
It offers CLI generators for scaffolding custom tools. We can generate any type of tools our business requires and start working with them in the Nova Admin Panel.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Custom Fields&lt;/strong&gt;&lt;br&gt;
Primarily Nova will come with all type of fields generally an admin panel need. But if we want any other information from our users we can define custom field types that will generate custom fields for us.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Cost of Laravel Nova
&lt;/h2&gt;

&lt;p&gt;Laravel Nova comes in two types of packages called Single and Unlimited. The single package allows a one-time payment of $99 which will allow the implementation of Laravel Nova in only one of our projects. And the Unlimited package also requires a one-time payment of $199 which will allow the implementation of Laravel Nova Dashboard in an unlimited number of projects. &lt;/p&gt;

&lt;p&gt;For an in-depth understanding of what features Laravel Nova offers us please visit &lt;a href="https://nova.laravel.com/docs/4.0/installation.html"&gt;Laravel Nova Documentation&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;The benefits of Laravel Nova include significant time savings for developers, the ability to easily integrate an admin panel with a good amount of functionalities into existing projects, and a large community that creates high-quality, open-source plugins, extensions, tutorials, and packages. So we can say Laravel Nova is indeed the first step toward building our CMS.&lt;/p&gt;

&lt;h2&gt;
  
  
  Our Products
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://1.envato.market/MeKGo"&gt;Gull - Bootstrap &amp;amp; Laravel Admin Dashboard Template&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/downloads/aatrox-tailwindcss-admin-dashboard-template/"&gt;Aatrox – TailwindCss Admin Dashboard Template&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://codecanyon.net/item/worktick-ultimate-hrm-project-management/36745818"&gt;WorkTick - Ultimate HRM &amp;amp; Project Management&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://codecanyon.net/item/stockyultimate-inventory-management-system-with-pos/31445124"&gt;Stocky - Ultimate Inventory Management System with Pos&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Similar Articles
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/blog/laravel-landing-page-templates/"&gt;Laravel Landing Page Templates (Free &amp;amp; Premium)&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/blog/best-laravel-admin-templates/"&gt;Best Laravel Admin Dashboard Templates for 2022 (Free &amp;amp; Premium)&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/blog/laravel-pagination/"&gt;Effortless Pagination With Laravel!&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://medium.com/@ui.lib.official/is-laravel-9-really-a-beast-a04fbb5b276a"&gt;Is Laravel 9 Really A Beast? 😼&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://uilib.hashnode.dev/manage-your-large-laravel-application-with-simplicity"&gt;Manage Your Large Laravel Application With Simplicity&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://uilib.hashnode.dev/tired-of-huge-and-complex-coding-for-permission-handling"&gt;Tired Of Huge And Complex Coding For Permission Handling?&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://uilib.hashnode.dev/need-authentication-features-for-your-project-built-with-laravel"&gt;Need Authentication Features For Your Project Built With Laravel?&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>laravel</category>
      <category>laravelnova</category>
      <category>admindashboard</category>
      <category>laraveladminpanel</category>
    </item>
    <item>
      <title>Laravel - What, Why &amp; Who!</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Wed, 06 Apr 2022 11:00:09 +0000</pubDate>
      <link>https://forem.com/uilibofficial/laravel-what-why-who-4hd9</link>
      <guid>https://forem.com/uilibofficial/laravel-what-why-who-4hd9</guid>
      <description>&lt;h3&gt;
  
  
  Introduction
&lt;/h3&gt;

&lt;p&gt;Laravel is basically a framework used to build web applications using PHP at the backend. It is one of the most popular PHP-based web frameworks considered nowadays. Laravel was introduced in June 2011 by developer Taylor Otwell. Its latest version Laravel 9 was launched in February 2022. &lt;/p&gt;

&lt;p&gt;It is well-known for the features it provides us with.  Application building is very easy and less time consuming with Laravel. Its built in packages make our coding journey less hectic. Laravel does most of our work for us. Implementing authentication and authorization, managing security, roles and permission handling, etc all can be integrated to a project by the help of some CLI commands. &lt;/p&gt;

&lt;h3&gt;
  
  
  How Laravel Works
&lt;/h3&gt;

&lt;p&gt;Laravel follows the MVC architecture or also known as the Model-View-Controller Structure which is a common application developing architecture. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--pA_DmcKV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4vqb9aayfk23ggmtci6x.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--pA_DmcKV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4vqb9aayfk23ggmtci6x.png" alt="MVC Architecture" width="880" height="968"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The MVC architecture is quite easy to understand. Whatever request a user inputs goes directly to the controller. After receiving a valid request from a user, the controller file interacts with the database to retrieve the requested information. Finally, the retrieved information from the database is shown as a response to the user in a view file. &lt;/p&gt;

&lt;p&gt;MVC architecture is very useful as it divides the presentation layer or the view file from the logical layer or the controller file. This makes identifying and fixing bugs easier. Also, it makes our code more structured and flexible.&lt;/p&gt;

&lt;h3&gt;
  
  
  Why Use Laravel
&lt;/h3&gt;

&lt;p&gt;Laravel offers variety of features and that is why one should think about using Laravel before starting a new project. Let us discuss some of the fetures of Laravel below,&lt;/p&gt;

&lt;h4&gt;
  
  
  Simplicity
&lt;/h4&gt;

&lt;p&gt;Laravel is simple and easy to understand. If you have a little coding knowledge with PHP and if you know how MVC structure works you are ready to work with Laravel. Starting a project with Laravel is just one command away. It generates all the necessary files and folders at the start of a project. &lt;/p&gt;

&lt;p&gt;So, we are given a common directory structure that we can start working on for our project. This common folder structure of Laravel makes analyzing the code of other developers less complex. &lt;/p&gt;

&lt;h4&gt;
  
  
  Security
&lt;/h4&gt;

&lt;p&gt;Implementing security measures for any mobile or web application is an important albeit hard thing to do. But with Laravel security is not your concern. Laravel takes care of all types of security issues that you may face from the start of your project. Also, Laravel provides many library packages implemented for handling security issues. &lt;/p&gt;

&lt;p&gt;As Laravel handles all types of requests by working as an intermediary system, harmful code injection is not an issue anymore. Also, its built-in CSRF token handles all types of security threats.&lt;/p&gt;

&lt;h4&gt;
  
  
  Artisan CLI
&lt;/h4&gt;

&lt;p&gt;Laravel comes with a built-in command-line tool named Artisan. This command-line tool helps developers not to perform repetitive tasks manually. Tasks like creating controller files, middleware, or models can be done easily with Artisan. Managing our database like creating migration files, or migrating databases can also be done with the help of Artisan.&lt;/p&gt;

&lt;h4&gt;
  
  
  Eloquent ORM
&lt;/h4&gt;

&lt;p&gt;Eloquent ORM offered with Laravel is also a handy tool for us. An ORM is always helpful to interact with databases and make queries. Laravel's Eloquent ORM is quite easy to understand as its syntax is quite similar to SQL. &lt;/p&gt;

&lt;h4&gt;
  
  
  Templating Engine
&lt;/h4&gt;

&lt;p&gt;Laravel also comes with a templating engine named Blade. Blade helps to build both static and dynamic both types of templates. Html, CSS, Javascript, and even raw PHP code can be written in Blade template. &lt;/p&gt;

&lt;h4&gt;
  
  
  Built-in Packages
&lt;/h4&gt;

&lt;p&gt;Laravel is widely admired for its huge amount of library packages. There are library packages for almost every functionality. From authentication to debugging your application can be done by the pre-built library packages. &lt;/p&gt;

&lt;p&gt;Some of Laravel's well-known packages are Laravel-Breeze(for authentication and authorization), Spatie(for assigning roles and permissions), Socialite(for authentication with social links like Facebook, Instagram, etc), Cashier(for payment gateway integration), and many more.&lt;/p&gt;

&lt;h3&gt;
  
  
  Who Uses Laravel
&lt;/h3&gt;

&lt;p&gt;Laravel is being used by many top-notch companies because of its highly appreciable features. Some large business companies that use Laravel development environment to manage their website are mentioned below,&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.pfizer.com/"&gt;Pfizer&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.bbc.com/"&gt;BBC&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.aboutyou.com/your-shop"&gt;About You&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.tourradar.com/"&gt;TourRadar&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://magnetoitsolutions.com/"&gt;Magneto IT Solutions&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.crowdcube.com/"&gt;Crowdcube&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://9gag.com/"&gt;9GAG&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Laravel is very handy for developing and maintaining the website for your large business. If you have a huge database system and your website has to do complex computing every time you should go for Laravel.&lt;/p&gt;

&lt;p&gt;If you feel interested in Laravel after reading this article feel free to visit Laravel's official documentation at &lt;a href="https://laravel.com/docs/9.x"&gt;Laravel&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Conclusion
&lt;/h3&gt;

&lt;p&gt;Laravel is truly a gem for any PHP web developer. It makes our coding life easy. The large amount of library packages it provides and the huge number of community support it has makes working with Laravel a ride to the Wonder Land. Now more developers are considering using Laravel which makes the Laravel Community bigger and stronger. &lt;/p&gt;

&lt;p&gt;For this reason if we get stuck with any issue we know we have an enormous Laravel community ready to help us. Also Laravel is a framework that gets updated regularly so any issues with Laravel framework will be fixed for sure. So if you are thinking about starting a project do give Laravel a try. &lt;/p&gt;

&lt;h3&gt;
  
  
  Our Products
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://1.envato.market/MeKGo"&gt;Gull - Bootstrap &amp;amp; Laravel  Admin Dashboard Template&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/downloads/aatrox-tailwindcss-admin-dashboard-template/"&gt;Aatrox – TailwindCss Admin Dashboard Template&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://codecanyon.net/item/worktick-ultimate-hrm-project-management/36745818"&gt;WorkTick - Ultimate HRM &amp;amp; Project Management&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://codecanyon.net/item/stockyultimate-inventory-management-system-with-pos/31445124"&gt;Stocky - Ultimate Inventory Management System with Pos&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Similar Articles
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/blog/laravel-landing-page-templates/"&gt;Laravel Landing Page Templates (Free &amp;amp; Premium)&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/blog/best-laravel-admin-templates/"&gt;Best Laravel Admin Dashboard Templates for 2022 (Free &amp;amp; Premium)&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://ui-lib.com/blog/laravel-pagination/"&gt;Effortless Pagination With Laravel!&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://medium.com/@ui.lib.official/is-laravel-9-really-a-beast-a04fbb5b276a"&gt;Is Laravel 9 Really A Beast? 😼&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://uilib.hashnode.dev/manage-your-large-laravel-application-with-simplicity"&gt;Manage Your Large Laravel Application With Simplicity&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://uilib.hashnode.dev/tired-of-huge-and-complex-coding-for-permission-handling"&gt;Tired Of Huge And Complex Coding For Permission Handling?&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://uilib.hashnode.dev/need-authentication-features-for-your-project-built-with-laravel"&gt;Need Authentication Features For Your Project Built With Laravel?&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>laravel</category>
      <category>php</category>
      <category>webframework</category>
      <category>phpbackend</category>
    </item>
    <item>
      <title>Uko UI - Free Figma Design System &amp; Dashboards. 🤩Don't Miss Out! 🏃‍♂️🏃‍♀️</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Sun, 09 Jan 2022 12:44:05 +0000</pubDate>
      <link>https://forem.com/uilibofficial/uko-ui-free-figma-design-system-dashboards-dont-miss-out-1e2a</link>
      <guid>https://forem.com/uilibofficial/uko-ui-free-figma-design-system-dashboards-dont-miss-out-1e2a</guid>
      <description>&lt;p&gt;&lt;a href="https://www.figma.com/community/file/1050702090477915676"&gt;Uko UI – Figma Dashboards &amp;amp; Design System&lt;/a&gt; is now Figma's one of the most trending Design System that has a ton of features, component, and template. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--tCNMPBws--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tp0moqofm7yx834c6jn7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--tCNMPBws--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tp0moqofm7yx834c6jn7.png" alt="Uko UI - Free Figma Design System &amp;amp; Dashboards" width="833" height="498"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If you want to build a web app or an admin dashboard, this is a great option for you. It can save you extra working hours, allowing you to focus on other important aspects of your project such as integrations, functionality, etc.&lt;/p&gt;

&lt;p&gt;The entire design system, including the dashboards, adheres to the highest industry standards and current design trends. As a result, there will be a good balance between overall user experience and stunning visual appeal.&lt;/p&gt;

&lt;p&gt;Now, without further ado, let's take a look at this design system and see what features are included. In addition, investigate their utility.&lt;/p&gt;

&lt;p&gt;With the help of this Design System and Dashboards, you can create any web apps that you can think of. For example,&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ecommerce Backends&lt;/li&gt;
&lt;li&gt;eCommerce frontends&lt;/li&gt;
&lt;li&gt;Analytics Apps&lt;/li&gt;
&lt;li&gt;SaaS Platforms&lt;/li&gt;
&lt;li&gt;Project Management Apps&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;and a lot more.&lt;/p&gt;

&lt;h2&gt;
  
  
  List of things that you'll receive here.
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Thumbnail&lt;/li&gt;
&lt;li&gt;Welcome&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Foundations&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Typography&lt;/li&gt;
&lt;li&gt;Colors&lt;/li&gt;
&lt;li&gt;Elevations/Shadow&lt;/li&gt;
&lt;li&gt;Buttons&lt;/li&gt;
&lt;li&gt;Components&lt;/li&gt;
&lt;li&gt;Form&lt;/li&gt;
&lt;li&gt;Base&lt;/li&gt;
&lt;li&gt;Icons&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Application's Example Pages&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Sign In/Sign Up
&lt;/li&gt;
&lt;li&gt;Error Page&lt;/li&gt;
&lt;li&gt;Dashboards&lt;/li&gt;
&lt;li&gt;eCommerce &amp;amp; Invoice&lt;/li&gt;
&lt;li&gt;eCommerce Admin&lt;/li&gt;
&lt;li&gt;Data Tables&lt;/li&gt;
&lt;li&gt;Account Settings&lt;/li&gt;
&lt;li&gt;Projects&lt;/li&gt;
&lt;li&gt;Calendar&lt;/li&gt;
&lt;li&gt;User Profile&lt;/li&gt;
&lt;li&gt;User Management&lt;/li&gt;
&lt;li&gt;Chat&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Application Components&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Sidebar &amp;amp; Header&lt;/li&gt;
&lt;li&gt;Dashboards&lt;/li&gt;
&lt;li&gt;Account Settings&lt;/li&gt;
&lt;li&gt;Projects&lt;/li&gt;
&lt;li&gt;Calendar&lt;/li&gt;
&lt;li&gt;User Profile&lt;/li&gt;
&lt;li&gt;Admin eCommerce&lt;/li&gt;
&lt;li&gt;User Management&lt;/li&gt;
&lt;li&gt;Data Table&lt;/li&gt;
&lt;li&gt;Sign In/Sign Up&lt;/li&gt;
&lt;li&gt;Chat&lt;/li&gt;
&lt;li&gt;eCommerce Contact/Invoice &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--fMM4u0J4--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iaqahptz0zyhiy3gopjs.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--fMM4u0J4--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iaqahptz0zyhiy3gopjs.png" alt="Uko UI - Figma Dashboards &amp;amp; Design System" width="880" height="405"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;🌟 50+ Pages and 150+ Components 🌟&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;5+ Dashboards&lt;/li&gt;
&lt;li&gt;8+ Application Pages&lt;/li&gt;
&lt;li&gt;150+ Pre Made Components&lt;/li&gt;
&lt;li&gt;50+ Prebuild Widgets&lt;/li&gt;
&lt;li&gt;20+ Charts Examples&lt;/li&gt;
&lt;li&gt;2+ Profile pages&lt;/li&gt;
&lt;li&gt;4+ Session Pages&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;As a designer or developer, you will be given a plethora of features and components, as well as instructions on how to structure a web app or an admin dashboard.&lt;/p&gt;

&lt;h2&gt;
  
  
  Key Features
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;100% Component-Based&lt;/li&gt;
&lt;li&gt;100% Auto layout&lt;/li&gt;
&lt;li&gt;Horizontal/Vertical navigation&lt;/li&gt;
&lt;li&gt;Dashboards&lt;/li&gt;
&lt;li&gt;eCommerce&lt;/li&gt;
&lt;li&gt;Account settings page&lt;/li&gt;
&lt;li&gt;Data table&lt;/li&gt;
&lt;li&gt;Chat&lt;/li&gt;
&lt;li&gt;Invoice&lt;/li&gt;
&lt;li&gt;Product management&lt;/li&gt;
&lt;li&gt;Order management&lt;/li&gt;
&lt;li&gt;Customer management&lt;/li&gt;
&lt;li&gt;Projects&lt;/li&gt;
&lt;li&gt;Todo&lt;/li&gt;
&lt;li&gt;Profile page&lt;/li&gt;
&lt;li&gt;Error page&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;and many more...&lt;/p&gt;

&lt;p&gt;However, all of the files you'll find in the free Figma community file aren't ones you can use. Some of them are screen captures. You can only access the entire design system and dashboards package if you purchase the premium version.&lt;/p&gt;

&lt;p&gt;Initially, the free version will suffice. However, you must download the premium version if you intend to use it for commercial purposes. The premium versions are very reasonably priced. As a result, if you want to use them for commercial purposes, this will not be an issue.&lt;/p&gt;

&lt;p&gt;How to use it in your Figma software?&lt;/p&gt;

&lt;p&gt;Click this &lt;a href="https://www.figma.com/community/file/1050702090477915676"&gt;link&lt;/a&gt; and after landing on the page, click the duplicate button. Based on your access and the location of the original file, Figma will create a copy of the file in your workspace.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://www.figma.com/file/ZEKLG24ZB2ejUG626dWhSu/Uko-Dashboard-%26-Design-System?node-id=3687%3A37818"&gt;&lt;strong&gt;Preview the full version&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You can download the premium version for commercial purpose from here. &lt;/p&gt;

&lt;p&gt;Recently, after its initial release, we gave away the first 150+ copies (Personal License) for free. But don't worry, if you still want the Full version (Personal License) for free, download the Beta version, give us a 5-star rating, and send a screenshot to &lt;a href="mailto:uilib.help@gmail.com"&gt;uilib.help@gmail.com&lt;/a&gt;, and we will send you the full version.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://uilib.gumroad.com/l/uko-figma?recommended_by=library"&gt;Premium Version&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  About Us
&lt;/h3&gt;

&lt;p&gt;We are &lt;a href="https://ui-lib.com/"&gt;Ui-Lib&lt;/a&gt;, a team of professional developers and designers attempting to make the lives of other developers easier. Please do visit our official website for more interesting free &amp;amp; premium products like this one. 😊&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>design</category>
      <category>ux</category>
      <category>figma</category>
    </item>
    <item>
      <title>AatroX Vue Lite - Open-Source VueJS 3 &amp; TailwindCSS Admin Dashboard Template is Out Now!</title>
      <dc:creator>UI Lib</dc:creator>
      <pubDate>Wed, 22 Dec 2021 13:14:56 +0000</pubDate>
      <link>https://forem.com/uilibofficial/aatrox-vue-lite-open-source-vuejs-3-tailwindcss-admin-dashboard-template-is-out-now-5h30</link>
      <guid>https://forem.com/uilibofficial/aatrox-vue-lite-open-source-vuejs-3-tailwindcss-admin-dashboard-template-is-out-now-5h30</guid>
      <description>&lt;p&gt;&lt;a href="https://ui-lib.com/downloads/aatrox-vue-dashboard/" rel="noopener noreferrer"&gt;AatroX Vue Lite - Open-Source VueJS 3 &amp;amp; TailwindCSS Admin Dashboard Template&lt;/a&gt; - is a useful, developer-friendly, and highly customizable dashboard template. It has everything you could want in an admin dashboard. We adhered to the highest industry standards to provide you with the best Vue Admin template.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://ui-lib.com/downloads/aatrox-vue-lite/" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2021%2F12%2Fatrox-vue-lite-vuejs-3-tailwindcss-1024x567.png" alt=""&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Atrox is extremely fast and simple to use, as well as highly scalable. So, with a little effort, you will be able to create any application you desire.&lt;/p&gt;

&lt;p&gt;Furthermore, the template design is eye-catching and fully responsive. As a result, no matter what device they use, anyone who visits your application will have a fantastic experience. It will run smoothly on all devices, including desktops, tablets, and smartphones.&lt;/p&gt;

&lt;p&gt;With the help of this template, you can create web apps like, &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ecommerce Backends&lt;/li&gt;
&lt;li&gt;Analytics Apps&lt;/li&gt;
&lt;li&gt;SaaS Platforms&lt;/li&gt;
&lt;li&gt;Project Management Apps&lt;/li&gt;
&lt;li&gt;Education Apps&lt;/li&gt;
&lt;li&gt;Fitness Apps&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;and a lot more.&lt;/p&gt;

&lt;p&gt;Atrox also includes useful features that will help you create high-quality apps exactly as you envision them. Furthermore, we've loaded the Atrox admin template with useful features like Vitejs, Nuxt-inspired routing, accessible front-end routing, and so on.&lt;/p&gt;

&lt;h3 id="h-key-features"&gt;Key Features&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Vue 3 &amp;amp; Vite&lt;/li&gt;
&lt;li&gt;Beautifully Crafted&lt;/li&gt;
&lt;li&gt;tailwindCSS&lt;/li&gt;
&lt;li&gt;Nuxt-inspired Routing&lt;/li&gt;
&lt;li&gt;Well Organized&lt;/li&gt;
&lt;li&gt;Production Ready&lt;/li&gt;
&lt;li&gt;Accessible frontend routing&lt;/li&gt;
&lt;li&gt;Ready to Deploy&lt;/li&gt;
&lt;li&gt;Clean Code&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Installation ⚒️
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;We recommend you use yarn
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;1 - Install all packages&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;yarn

# npm install [for npm]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;2 - Run development server&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;yarn dev

# npm run dev [for npm]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;3 - Generate build files for deployment&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;yarn build

# npm run build [for npm]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  What’s Included 📦
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://aatrox-vue-free.netlify.app/dashboards/dashboard-version-one" rel="noopener noreferrer"&gt;Dashboard Page&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://aatrox-vue-free.netlify.app/components/button" rel="noopener noreferrer"&gt;Buttons Page&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://aatrox-vue-free.netlify.app/profile/profileTwo" rel="noopener noreferrer"&gt;Profile Page&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://aatrox-vue-free.netlify.app/signIn" rel="noopener noreferrer"&gt;Sign in Page&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://aatrox-vue-free.netlify.app/signUp" rel="noopener noreferrer"&gt;Sign Up Page&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Browser Support 🖥️
&lt;/h2&gt;

&lt;p&gt;AatroX Vue Lite - open-source VueJS 3 &amp;amp; TailwindCSS admin dashboard template is built to work best in the latest desktop and mobile and tablet browsers. It supports all the major browsers including.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Chrome (latest)&lt;/li&gt;
&lt;li&gt;FireFox (latest)&lt;/li&gt;
&lt;li&gt;Safari (latest)&lt;/li&gt;
&lt;li&gt;Opera (latest)&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Documentation
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://aatorx-vue-doc.vercel.app/" rel="noopener noreferrer"&gt;Documentation&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Looking For a Premium Version? 🧐
&lt;/h2&gt;

&lt;p&gt;If you want to save even more time and design effort, we have a pro version of this product that includes even more pages and components.&lt;/p&gt;

&lt;p&gt;You can upgrade to the &lt;a href="https://ui-lib.com/downloads/aatrox-vue-dashboard" rel="noopener noreferrer"&gt;Aatrox Vue – Vuejs 3 &amp;amp; TailwindCss Admin Dashboard's&lt;/a&gt; version. It comes with many dashboard versions, apps, tons of components, charts, and a lot more. &lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Free Version &lt;/td&gt;
&lt;td&gt;&lt;a href="https://ui-lib.com/downloads/aatrox-vue-dashboard" rel="noopener noreferrer"&gt;Aatrox Dashboard PRO&lt;/a&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;
&lt;strong&gt;5&lt;/strong&gt; Demo Pages&lt;/td&gt;
&lt;td&gt;
&lt;strong&gt;50+&lt;/strong&gt; demo pages&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;❌&lt;/td&gt;
&lt;td&gt;✔ Dark &amp;amp; Light Mode&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt; ✔ 1 Dashboard&lt;/td&gt;
&lt;td&gt;✔ 5 Dashboard&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt; ❌ &lt;/td&gt;
&lt;td&gt;✔ 11 App Pages&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt; ❌ &lt;/td&gt;
&lt;td&gt;✔ 6 UiKits Pages&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt; ❌ &lt;/td&gt;
&lt;td&gt;✔ Advanced Widgets&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;  ✔ 1 Profile Version&lt;/td&gt;
&lt;td&gt;✔ 2 Profile Versions&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;  ✔  2 Authentication Page&lt;/td&gt;
&lt;td&gt;✔ 10 Authentication Pages&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt; ❌ &lt;/td&gt;
&lt;td&gt;✔ 10 Types of Charts Demo Pages&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;For more info click the image below 👇&lt;/p&gt;

&lt;p&gt;&lt;a href="https://ui-lib.com/downloads/aatrox-vue-dashboard" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fui-lib.com%2Fblog%2Fwp-content%2Fuploads%2F2021%2F12%2FAatrox-1024x741.png" alt=""&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  About Us
&lt;/h2&gt;

&lt;p&gt;We are &lt;a href="https://ui-lib.com/" rel="noopener noreferrer"&gt;Ui-Lib&lt;/a&gt;, a team of awesome developers and designers attempting to make the lives of other developers easier. 😊&lt;/p&gt;

</description>
      <category>vue</category>
      <category>tailwindcss</category>
      <category>opensource</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
