
What you would learn in Craft Scalable, Custom-Made Interfaces with Tailwind CSS course?
Learn the basics of designing a modern web application with Tailwind CSS's utility class and also some tips and tricks to incorporate it into component-based frameworks such as React as well as Vue.
Functional CSS has seen a rise in popularity and with well-founded reasons: it lets developers create customized user interfaces without any sloppy modifications or overrides that have been a problem for existing tools such as Bootstrap for years.
In the realm of Functional CSS libraries, Tailwind is the top contender. In many ways, it's one of the most popular technology pieces currently for front-end web development. Its APIs can make developers feel highly productive. Since it's a collection of well-thought-out CSS classes, users are able to make use of it from inside the HTML designs or even render your functions without needing to learn any new tools or even open an entirely separate file.
If you're a Web designer looking to get involved in front-end design and development design, you owe it yourself to try Tailwind the chance to ensure that you don't be left out of one of the most exciting emerging trends in our field.
The Course Project
Through this course, you'll develop a Discord app that is cloned down to the hover effects, padding, and colors included in the UI of the app.
By doing this, you will gain some things:
- You'll be taught the Tailwind process
- How do I personalize Tailwind for an app?
- Get exposed to the design decisions made by an expert team
- Find patterns in design when you design an interface
- You will leave with stunning components that you can apply to other applications.
Following this course, select one of the applications you like-- Gmail or Slack, for example -- and copy your UI for a test of the skills you've accumulated.
Tailwind Workflow
In Tailwind, you'll be taught to apply the 'tinkering' process. Since classes are easy to modify and put together, it is possible to find the layout you like. Making adjustments to colors, padding, and margins at a moment's notice is easy!
When you're comfortable with this method, you'll notice that you've duplicated classes. This is a good thing! The effort required in applying and composing classes is so minimal that it doesn't matter if there is a little duplicate code.
If you notice an increase in duplication, it is possible to abstract what is causing the duplication by removing it at the element level rather than the CSS level.
Course Content:
- 1 Intro to Styling Custom UIs with Tailwind Utility Classes
- 2 Scaffolding a Multi-Panel App Layout with Flexbox
- 3 Making Panels Scrollable with Flexbox
- 4 Customizing Tailwind’s Color Palette With Your Brand
- 5 Adding Custom Fonts to Tailwind
- 6 Building a Hoverable Server Selector With SVG
- 7 Transitioning Rounded Corners using the JIT Compiler
- 8 Conditionally Applying Classes Based on the Active URL
- 9 Building the Active Server Indicator using Group and Transform Utilities
- 10 Solving the Duplication Problem with Components
- 11 Building the Server Header using Arbitrary Values from the JIT Compiler
- 12 Styling the Channel List and Controlling Layout
- 13 Identifying Repeated Patterns while Dynamically Generating the Channel List
- 14 Styling the Active Channel Link with a New Dynamic URL Segment
- 15 Using a State Variable to Add Unread States to the Channel Nav
- 16 Building Collapsible Categories with Rotating Arrow Icons
- 17 Building the Channel Header with Flexbox Shrink and Truncating Text
- 18 Styling the Search Box Using the Forms Plugin
- 19 Using Components to Dynamically Generate the Channel's Messages
- 20 Dynamically Generating the Server and Channel Navs
- 21 Using Responsive Design to Hide the Desktop Navigation
Download Craft Scalable, Custom-Made Interfaces with Tailwind CSS from below links NOW!
You are replying to :
Access Permission Error
You do not have access to this product!
Dear User!
To download this file(s) you need to purchase this product or subscribe to one of our VIP plans.
Note
Download speed is limited, for download with higher speed (2X) please register on the site and for download with MAXIMUM speed please join to our VIP plans.