All Projects → barahonajm → blazor-tailwindcss-template

barahonajm / blazor-tailwindcss-template

Licence: MIT License
This template demostrates the integration of tailwindcss with blazor and covers important features like hot-reload and css isolation

Programming Languages

HTML
75241 projects
CSS
56736 projects
javascript
184084 projects - #8 most used programming language
C#
18002 projects

Projects that are alternatives of or similar to blazor-tailwindcss-template

TheLastTime
C# .NET 5 Blazor WebAssembly Progressive Web Application that tracks when was the last time you did something
Stars: ✭ 23 (-39.47%)
Mutual labels:  aspnetcore, asp-net-core, blazor, blazor-webassembly
smart-blazor
Blazor UI Components & Examples
Stars: ✭ 32 (-15.79%)
Mutual labels:  aspnetcore, asp-net-core, blazor, blazor-webassembly
BlazorWasmWithDocker
Companion code sample for my blog post - Containerising a Blazor WebAssembly App
Stars: ✭ 16 (-57.89%)
Mutual labels:  aspnetcore, asp-net-core, blazor, blazor-webassembly
XAF Security E4908
This repository contains examples for Role-based Access Control, Permission Management, and OData / Web / REST API Services for Entity Framework and XPO ORM
Stars: ✭ 47 (+23.68%)
Mutual labels:  aspnetcore, asp-net-core, blazor
BlazorServerWithDocker
Companion code sample for my blog post - Containerising a Blazor Server App
Stars: ✭ 16 (-57.89%)
Mutual labels:  aspnetcore, asp-net-core, blazor
Awesome Blazor
Resources for Blazor, a .NET web framework using C#/Razor and HTML that runs in the browser with WebAssembly.
Stars: ✭ 6,063 (+15855.26%)
Mutual labels:  aspnetcore, asp-net-core, blazor
ASPCore.BlazorCrud
CRUD Using Blazor And Entity Framework Core
Stars: ✭ 39 (+2.63%)
Mutual labels:  asp-net-core, blazor, blazor-webassembly
blazor-ui
A collection of examples related to Telerik UI for Blazor Components: https://www.telerik.com/blazor-ui
Stars: ✭ 182 (+378.95%)
Mutual labels:  aspnetcore, blazor, blazor-webassembly
Home
Home for Blazor Extensions
Stars: ✭ 51 (+34.21%)
Mutual labels:  aspnetcore, asp-net-core, blazor
BlazoredLocalStorage
This library has been moved to the Blazored org
Stars: ✭ 26 (-31.58%)
Mutual labels:  aspnetcore, asp-net-core, blazor
AspNetCore.Mvc.FluentActions
Fluent Actions for ASP.NET Core MVC are abstractions of regular MVC actions that are converted into MVC actions during startup.
Stars: ✭ 17 (-55.26%)
Mutual labels:  aspnetcore, asp-net-core
SyncfusionHelpDeskClient
Syncfusion Help Desk WebAssembly
Stars: ✭ 15 (-60.53%)
Mutual labels:  blazor, blazor-webassembly
MudBlazor.Markdown
Markdown component based on the MudBlazor environment
Stars: ✭ 30 (-21.05%)
Mutual labels:  blazor, blazor-webassembly
FlashCards
Learning Blazor By Creating A Flash Cards Application
Stars: ✭ 17 (-55.26%)
Mutual labels:  asp-net-core, blazor
Blazor.Pagination
A reusable pagination component for Blazor.
Stars: ✭ 27 (-28.95%)
Mutual labels:  asp-net-core, blazor
N-Tier-Architecture
This is a n-layer architecture based on Common web application architectures.
Stars: ✭ 105 (+176.32%)
Mutual labels:  asp-net-core, blazor-webassembly
Something-about-aspnetcore-book
The Something about ASP.NET Core Book is introduction to web programming and based on ASP.NET Core 2.2
Stars: ✭ 35 (-7.89%)
Mutual labels:  aspnetcore, asp-net-core
OrdersManagementSystem
Project demonstrates usage of Prism composition library, Material design library, SQL Server, Entity Framework in WPF application
Stars: ✭ 29 (-23.68%)
Mutual labels:  aspnetcore, asp-net-core
Home
Asp.net core Mvc Controls Toolkit
Stars: ✭ 33 (-13.16%)
Mutual labels:  aspnetcore, asp-net-core
SignalR-Core-SqlTableDependency
Shows how the new SignalR Core works with hubs and sockets, also how it can integrate with SqlTableDependency API.
Stars: ✭ 36 (-5.26%)
Mutual labels:  aspnetcore, asp-net-core
ℹ️ A nuget package covering this use case has been released on https://github.com/Practical-ASP-NET/Tailwind.Extensions.AspNetCore feel free to take a look.




Blazor + Tailwind

This template demostrates the integration of tailwindcss with blazor and covers important features like hot-reload and css isolation.

BlazorTailwindIntegration.mp4

Description

The main goal of this template is to provide an clean integration with tailwindcss thus it will not modify anything from the official blazor template. Once integration is done there will be additional work to bring tailwindcss templates to blazor :D

⚠️ I have not tested using hot-reload on VS, so this currently works using dotnet-watch

Features

  • css-isolation works with tailwindcss and @apply directives
  • hot-reload considers tailwind compilation
  • <styles> gets compiled and copied over wwwroot without unused styles when release mode
  • change tailwindcss to use JIT compiler
  • only changed files gets re-compiled
  • make true hot-reload work on sytles.css
  • have the post-css hot reload windows close along with donet-watch
  • approach clean up (clean the code and make them more understadable)
  • convert template to a real dotnet template
  • create nuget package to add tailwindcss support for already created projects
  • improve performance and make compilation faster

Requirements

  • .NET 6 Preview 6
  • Node.js 14+
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].