Phoenix Liveview Svelte Tailwind

Overview

Phovelte is a project that demonstrates how to set up a Phoenix project with Liveview, Typescript, Svelte, and Tailwind. This combination of technologies allows for a powerful and dynamic web development experience. The project provides a quick start guide and includes the necessary installations and dependencies.

Features

• Quick start: Get started quickly by cloning the repository and following the provided guide.
• Liveview: Utilize Phoenix Liveview for real-time updates and seamless user experiences.
• Typescript: Take advantage of the type safety and modern features of Typescript for frontend development.
• Svelte: Use Svelte to build efficient and reactive components for your web application.
• Tailwind CSS: Enhance the styling of your application with the utility-first framework of Tailwind CSS.

Installation

To install Phovelte, follow these steps:

1. Make sure you have Elixir v1.11.2 (or a compatible version), Node v12, and either npm or yarn installed.
2. Clone the repository using the command: $ git clone --depth=1 https://github.com/colus001/phoenix-liveview-svelte-tailwind.git <YOUR_PROJECT_NAME>
3. Move to the appropriate directory: cd <YOUR_PROJECT_NAME>
4. Run mix deps.get to install Elixir dependencies.
5. Run cd assets && yarn to install JavaScript dependencies.
6. Finally, run mix phx.server to start the example app at http://localhost:4000.

Summary

Phovelte is a project that demonstrates the setup of a Phoenix project with Liveview, Typescript, Svelte, and Tailwind. By following the provided quick start guide, users can easily set up their own projects and take advantage of the powerful features offered by these technologies. The project is accompanied by helpful resources such as documentation and references to further enhance the development experience.