Skip to content

Latest commit

 

History

History
92 lines (58 loc) · 2.35 KB

README.md

File metadata and controls

92 lines (58 loc) · 2.35 KB
Raw

ASP.NET (Core) MVC Template + HTMX + Tailwind + Vertical Slice Architecture Template (VSA)

This is a GitHub Template for ASP.NET Core MVC using .NET 6.

It contains

  • a .NET 8 Solution configured for Vertical Slice Architecture (VSA)
  • a ASP.NET Core MVC 8 project
  • HTMX
  • HTMX .NET extensions
  • TailwindCSS 3 including hot reload (JIT)
  • tmux/tmuxinator windows / panes for development

Usage

Create a new Repository

  • Create a new Repository from this Template as described here.
  • Clone your new repository locally

Run the solution

First time

yarn install
cd src/AspNetCoreMvcHtmx
yarn install
libman restore

Development

yarn start

tmuxinator starts a new session with three windows:

Workspace

App (.NET output)

Frontend (tailwind build)

Browse https://localhost:5001

HTMX interaction

HTMX usage is shown on the Registration view, even the password strength indicator is build with pure ASP.NET and HTMX (no additional JavaScript)

Known issues

  • Not tested on Windows
  • JetBrains Rider code completion does not work for TailwindCSS 3 JIT mode in .cshtml files currently.

Renaming solution / project / folders

Of course, you want to rename the projects files to match our needs.

You can use these commands, e.g. AspNetCoreMvcHtmx gets renamed to MyApp:

Rename all references inside the files

macOS

LC_ALL=C find . -type f -name '*.*' -not \( -path './node_modules/*' -o -path './src/AspNetCoreMvcHtmx/node_modules/*' -o -path './assets' \) -exec sed -i '' 's|AspNetCoreMvcHtmx|MyApp|g' {} \;

Linux

LC_ALL=C find . -type f -name '*.*' -not \( -path './node_modules/*' -o -path './src/AspNetCoreMvcHtmx/node_modules/*' -o -path './assets' \) -exec sed -i 's/AspNetCoreMvcHtmx/MyApp/g' {} \;

Rename files and folders

macOS and Linux

find . -depth -name "*AspNetCoreMvcHtmx*" | \
while IFS= read -r ent; do mv $ent ${ent%AspNetCoreMvcHtmx*}MyApp${ent##*AspNetCoreMvcHtmx}; done