How to install Symfony with Flowbite and Tailwind CSS

• tailwind-symfony-starter

  6 18 3.6 Twig

  Free and open-source starter kit for Symfony (PHP), Tailwind CSS and Flowbite

  

  The awesome open-source community from Flowbite created a Symfony and Tailwind CSS starter project that you can use to skip this integration guide and use it as starting point for your future Symfony, Tailwind CSS and Flowbite projects.

• PHPT

  276 37,212 10.0 C

  The PHP Interpreter

  

  Make sure that before you get started you have both PHP (v8.1 or higher), Composer and Node.js installed on your local environment so that Symfony, Tailwind CSS and Flowbite can be properly set up and configured.

• InfluxDB

  www.influxdata.com

  sponsored

  Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  

• Tailwind CSS

  1,275 77,985 8.8 TypeScript

  A utility-first CSS framework for rapid UI development.

  

  Tailwind CSS is a popular and open-source utility-first CSS framework that allows you to code styles directly inside your HTML based on preconfigured classes that will speed up your UI front-end development.

• symfony-cli

  6 495 9.2 Go

  The Symfony CLI tool

  

  The most straightforward approach for creating a new Symfony project is to use the official Symfony CLI installer which you can easily install on macOS and Linux devices using Homebrew:

• Symfony

  151 29,274 10.0 PHP

  The Symfony PHP framework

  

  Symfony is one of the definitive web application frameworks in the PHP ecosystem offering over 50 standalone PHP components and a MVC framework for your web application that you can use to build complex applications, website pages and even API services.

• flowbite

  188 6,890 9.8 JavaScript

  Open-source UI component library and front-end development framework based on Tailwind CSS

  

  {% extends 'base.html.twig' %} {% block body %} class="bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800"> class="flex flex-wrap items-center justify-between max-w-screen-xl mx-auto"> href="https://flowbite.com" class="flex items-center"> src="https://flowbite.com/docs/images/logo.svg" class="h-6 mr-3 sm:h-9" alt="Flowbite Logo" /> class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">Flowbite class="flex items-center lg:order-2"> href="#" class="text-gray-800 dark:text-white hover:bg-gray-50 focus:ring-4 focus:ring-gray-300 font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 mr-2 dark:hover:bg-gray-700 focus:outline-none dark:focus:ring-gray-800">Log in href="#" class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 mr-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800">Get started data-collapse-toggle="mobile-menu-2" type="button" class="inline-flex items-center p-2 ml-1 text-sm text-gray-500 rounded-lg lg:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600" aria-controls="mobile-menu-2" aria-expanded="false"> class="sr-only">Open main menu class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"> class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd">

Suggest a related project