¿Tienes curiosidad por saber por qué decidí crear CoreUI? Lea este artículo: Experto en todos los oficios, maestro en nada. Por qué las plantillas de administración de Bootstrap apestan.
CoreUI ofrece 6 versiones: Bootstrap, Angular, Laravel, React.js, Vue.js y Vue.js + Laravel.
CoreUI está destinado a cambiar las reglas del juego UX. El código puro y transparente carece de componentes redundantes, por lo que la aplicación es lo suficientemente liviana para ofrecer la mejor experiencia de usuario. Esto también se aplica a los dispositivos móviles, donde la navegación es tan fácil e intuitiva como en una computadora de escritorio o portátil. La API de diseño CoreUI le permite personalizar su proyecto para casi cualquier dispositivo, ya sea móvil, web o aplicación web. ¡CoreUI los cubre todos!
Versiones
CoreUI Pro
Plantillas de administración creadas sobre CoreUI Pro
Instalación
Uso
Características
Creadores
Comunidad
Proyectos Comunitarios
Licencia
Apoyar el desarrollo de CoreUI
CoreUI está construido sobre Bootstrap 4 y es compatible con marcos populares.
Plantilla de administración de Bootstrap gratuita de CoreUI
Plantilla de administración angular gratuita de CoreUI
Plantilla de administración Laravel gratuita de CoreUI
Plantilla de administración CoreUI React.js gratuita
Plantilla de administración Vue.js gratuita de CoreUI
Plantilla de administración CoreUI Vue.js + Laravel gratuita
Plantilla de administración CoreUI Pro Bootstrap
Plantilla de administración angular CoreUI Pro
Plantilla de administración CoreUI Pro Laravel
Plantilla de administración de CoreUI Pro React
Plantilla de administración CoreUI Pro Vue
Plantilla de administración CoreUI Pro Vue + Laravel
Tema predeterminado | Tema heredado | Diseño oscuro |
---|---|---|
# clonar el repositorio$ git clone https://github.com/coreui/coreui-free-laravel-admin-template.git my-project# ir al directorio de la aplicación$ cd my-project# instalar las dependencias de la aplicación$ compositor instalar# instalar dependencias de la aplicación $ npm install
# crear base de datos$ tocar base de datos/base de datos.sqlite
Copie el archivo ".env.example" y cambie su nombre a ".env". Luego, en el archivo ".env", reemplace esta configuración de base de datos:
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=raíz
DB_PASSWORD=
A esto:
DB_CONNECTION=sqlite
DB_DATABASE=/ruta_a_su_proyecto/database/database.sqlite
Instalar PostgreSQL
Crear usuario
$ sudo -u postgres crear usuario --interactivo ingrese el nombre del rol a agregar: laravel ¿El nuevo rol será un superusuario (s/n) n? ¿Se le permitirá al nuevo rol crear una base de datos (sí/no)? n ¿Se permitirá que el nuevo rol cree más roles nuevos? (sí/no) n
Establecer contraseña de usuario
$ sudo -u postgrespsql postgres= ALTERAR USUARIO laravel CON CONTRASEÑA CIFRADA 'contraseña';postgres= q
Crear base de datos
$ sudo -u postgres creadob laravel
Copie el archivo ".env.example" y cambie su nombre a ".env". Luego, en el archivo ".env", reemplace esta configuración de base de datos:
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=raíz
DB_PASSWORD=
A esto:
DB_CONNECTION=pgsql
DB_HOST=127.0.0.1
DB_PORT=5432
DB_DATABASE=laravel
DB_USERNAME=laravel
DB_PASSWORD=contraseña
Copie el archivo ".env.example" y cambie su nombre a ".env". Luego en el archivo ".env" complete esta configuración de base de datos:
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=raíz
DB_PASSWORD=
Si la URL de su proyecto se ve así: ejemplo.com/subcarpeta Luego vaya a
my-project/.env
y modifique esta línea:
URL_APLICACIÓN =
Para que se vea así:
APP_URL = http://ejemplo.com/subcarpeta
# en el directorio de su aplicación# generar laravel APP_KEY$ php craft key:generar# ejecutar la migración de la base de datos y seed$ php artisan migrar:refresh --seed# generar mezcla$ npm ejecutar dev# y repetir generar mezcla$ npm ejecutar dev
# iniciar el servidor local$ php servicio artesanal# prueba$ proveedor php/bin/phpunit
Abra su navegador con la dirección: localhost:8000
Haga clic en "Iniciar sesión" en el menú de la barra lateral e inicie sesión con sus credenciales:
Correo electrónico: [email protected]
Contraseña: contraseña
Este usuario tiene roles: usuario y administrador
Instrucciones solo para la plantilla de administración CoreUI Free Laravel. Las versiones Pro y Vue.js tienen instrucciones separadas.
my-project/database/seeds/MenusTableSeeder.php
En la función run()
- agregue insertLink()
:
$id = $this->insertLink( $rolesString, $visibleName, $href, $iconString);
$rolesString
: una cadena con una lista de roles de usuario que este elemento de menú estará disponible, ej. "guest,user,admin"
$visibleName
: un título de cadena visible en la barra lateral
$href
- un href, ej. /homepage
o http://example.com
$iconString
: una cadena que contiene un nombre de icono CoreUI válido (kebab-case), ej. cil-speedometer
o cil-pencil
Para agregar un título a la barra lateral, use la función insertTitle()
:
$id = $this->insertTitle( $rolesString, $título);
$rolesString
: una cadena con una lista de roles de usuario que este elemento de menú estará disponible, ej. "guest,user,admin"
$title
: un título de cadena visible en la barra lateral
Para agregar un menú desplegable a la barra lateral, use la función beginDropdown()
:
$id = $this->beginDropdown( $rolesString, $visibleName, $iconString);
$rolesString
: una cadena con una lista de roles de usuario que este elemento de menú estará disponible, ej. "guest,user,admin"
$visibleName
: un título de cadena visible en la barra lateral
$iconString
: una cadena que contiene un nombre de icono CoreUI válido (kebab-case). Por ejemplo: cil-speedometer
o cil-pencil
Para finalizar la sección desplegable, utilice la función endDropdown()
.
Para agregar un enlace a la función de llamada desplegable insertLink()
entre las llamadas a funciones beginDropdown()
y endDropdown()
. Ejemplo:
$id = $this->beginDropdown('invitado,usuario,admin', 'Algún menú desplegable', 'cil-puzzle');$id = $this->insertLink('invitado,usuario,admin', 'Nombre del menú desplegable' , 'http://ejemplo.com');$this->endDropdown();
IMPORTANTE : al final de la función run()
, llame a la función joinAllByTransaction()
:
$this->joinAllByTransaction();
Una vez que haya terminado con la edición del archivo de semillas, ejecute :
$ php artisan migrar:refresh --seed# Este comando también revierte la base de datos y la migra nuevamente.
Notas
Usuarios
Gestión de menús
Administrar elementos del menú
Gestión de roles
gestion de los medios
PAN
Plantillas de correo electrónico
Es un ejemplo de presentación de datos en una tabla de paginación y funcionalidad CRUD.
Es un ejemplo sencillo de cómo gestionar usuarios registrados.
Es un sistema que le permite crear un nuevo menú y editar menús existentes. Para colocar un nuevo menú llamado "nuevo" en cualquier vista, use este código:
<?phpuse AppMenuBuilderFreelyPositionedMenus;if(isset($appMenus['new'])){ FreelyPositionedMenus::render( $appMenus['new'] , '', 'tu-clase-css-de-ul-elemento'); }?>
Le permite agregar, editar y eliminar elementos del menú. Para agregar un nuevo elemento de menú al menú debe:
especifique a qué menú está agregando el elemento,
especificar los roles de los usuarios para quienes el elemento será visible
nombrar el artículo
escriba (a elegir: enlace, título y menú desplegable)
Href, la dirección a la que se refiere el artículo,
Padre (para anidar el elemento dentro del menú desplegable)
Iconos CORUI
Le permite crear, editar, eliminar y reordenar roles de usuario. Cuando un usuario tiene más de un rol, se utiliza el rol jerárquico más alto para crear un menú para él.
Permite:
Cree carpetas de medios virtuales.
Enviar medios a aplicaciones.
Mover medios entre carpetas,
Cortar imágenes,
BREAD significa: explorar, leer, editar, agregar, eliminar. Nuestro sistema PAN le permite generar fácil y rápidamente para cualquier tabla, desde la base de datos, un PAN simple. Para crear un nuevo PAN simplemente ingrese el nombre de una tabla de la base de datos. Luego ingrese un nombre para el formulario. Ingrese el número de filas en la tabla de exploración. Elija si desea que la tabla de exploración contenga botones: "mostrar", "editar", "agregar", "eliminar". Asigne roles para los usuarios que podrán utilizar el PAN listo. Luego complete cada columna de la tabla por separado:
el nombre de la columna visible para el usuario,
el tipo de entrada para la columna. El último paso es seleccionar las casillas de verificación apropiadas:
navegar (permite mostrar la columna en la tabla de datos),
leer (le permite mostrar la columna en la vista de presentación)
editar (habilita la edición de columnas)
agregar (le permite completar los datos de la columna al agregar un registro. Obligatorio si la columna no admite valores NULL). También es posible manejar relaciones con otra tabla. Si la columna es una clave externa, se debe especificar: en el campo "Nombre de la tabla de relaciones opcional" - nombre de la tabla a la que se refiere la clave externa, en el campo "Nombre de la columna opcional en la tabla de relaciones - para imprimir" - el nombre de la columna que está en la tabla de relaciones que se va a mostrar. Finalmente, seleccione uno de los dos "tipos de campo" que se relacionan con la relación: 'selección de relación' o 'radio de relación'.
Es un ejemplo de gestión de plantillas de correo electrónico. Le permite crear, editar y eliminar plantillas. También le permite enviar un correo electrónico a una dirección seleccionada.
Łukasz Holeczek
https://twitter.com/lukaszholeczek
https://github.com/mrholek
Andrzej Kopanski
https://github.com/xidedix
Marcin Michałek
https://github.com/rakieta2015
Obtenga actualizaciones sobre el desarrollo de CoreUI y charle con los mantenedores del proyecto y los miembros de la comunidad.
Siga a @core_ui en Twitter.
Lea y suscríbase al blog de CoreUI.
Los íconos CoreUI son símbolos bellamente diseñados para acciones y elementos comunes. Puede utilizarlos en sus productos digitales para web o aplicación móvil. Fuentes y hojas de estilo listas para usar que funcionan con tus marcos favoritos.
https://coreui.io/icons/
derechos de autor 2020 creativeLabs Łukasz Holeczek. Código publicado bajo la licencia MIT. Solo hay una limitación: no puedes redistribuir CoreUI como stock. No puede hacer esto si modifica CoreUI. En el pasado nos enfrentamos a algunos problemas con personas que intentaban vender plantillas basadas en CoreUI.
CoreUI es un proyecto de código abierto con licencia del MIT y de uso completamente gratuito. Sin embargo, la cantidad de esfuerzo necesaria para mantener y desarrollar nuevas funciones para el proyecto no es sostenible sin el respaldo financiero adecuado. Puede apoyar el desarrollo donando en PayPal, comprando la versión CoreUI Pro o comprando una de nuestras plantillas de administración premium.
A partir de ahora, estoy explorando la posibilidad de trabajar en CoreUI a tiempo completo; si usted es una empresa que está creando productos principales utilizando CoreUI, también estoy abierto a conversaciones sobre acuerdos de consultoría o patrocinio personalizados. Ponte en contacto en Twitter.