entr VS nextjs-tailwind-ionic-capacitor-starter

entr, A utility for running arbitrary commands when files change, yes basically this bad boy lets you run any command (or bunch of them as will cover in Makefile) when files change.

This is the same TUI app workflow I've settled on in other languages. Three notes:

- entr is a good livereload tool: https://eradman.com/entrproject/. I prefer to wrap the livereload scripts in a Makefile, under something like `make dev`.

- Managing layout arithmetic by yourself is a real pain. A widget abstraction like Bubbletea's is very helpful. Also, don't forget about weird Unicode characters (eg. emoji) potentially breaking width calculations.

- Since this follows the Elm architecture, consider storing your data the Elm way into one big, flat Model. Elm webapps turn into headaches when you split state among submodels. I think the same happens in TUI apps. I'm glad the author found a solution with a tree of models and message passing. But personally, I'd rather have a Model with 100 fields than the complexity of sumbodels.

Do I really need a whole Go library to do that? There must be a lighter or in other words Linux solution. I came across few solutions but not all had the capability to handle all types of directory changes. I wanted to be able to watch for file: create, edit, move, delete. For example entr doesn't rerun the command when a new file is added to the directory that is being watched.

entr ("Event Notify Test Runner"; GitHub), is a command-line tool written by Eric Radman that allows running arbitrary commands whenever files change.

wow, that's a weird limitation.

The README says: "SSR is currently disabled for the Next.js app as the app will be fully client-side rendered for iOS and Android. This is a limitation we are working to address in a future update."

I guess it's because CapacitorJS pre-bundles the entire PWA for the App Stores:

"Of course, you also could load the app completely remotely by changing the server.url configuration for Capacitor to point to your SSR'ed Next.js app, but that has other challenges such as App Store approval if the app doesn't check the boxes for Apple to qualify it as an app that has enough native integration (at that point this is on you, not Capacitor)"

https://github.com/mlynch/nextjs-tailwind-ionic-capacitor-st...

But I don't understand why SSR would be disabled for the NextJS PWA on the web?

Maybe Max Lynch aka. @mlynch aka. @yesimahuman could provide some insight here.

If you want to use something like tailwind to customize the content of your pages, that is a decent option. You would use Ionic for the shell and Tailwind for your page designs. Take a look at this example if you want to explore that route (in React though): https://github.com/mlynch/nextjs-tailwind-ionic-capacitor-starter

Max Lynch from Ionic has a great repo demonstrating this. He uses it to get Next to work with Ionic and Capacitor but the idea is essentially the same.

Agreed! Next.js works great with this model! I’d recommend Capacitor over Cordova (similar but more modern). Here’s an example: https://github.com/mlynch/nextjs-tailwind-ionic-capacitor-st...

You can use Next with React Router, making it function exactly as a React app with nested routes. This project shows this working with Ionic's router, but the same setup can be used with React Router for the same outcome.

Also, note that this repository is a boilerplate for all 3, which uses ionic capacitor, in one repository: https://github.com/mlynch/nextjs-tailwind-ionic-capacitor-starter , I guess it is not using nextjs SSR capability though.

If you're confused by all the project names and how they work together, don't worry, I'll break down each part of the stack each project is concerned with, along with some visuals and code samples demonstrating how all the projects work together. At the end I'll share a starter project with these technologies installed and working together that can form the foundation of your next app.