npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

laboratoria-ui

v2.14.1

Published

Downloads

4

Readme

Laboratoria UI

Laboratoria UI es un tema personalizado de Material UI con algunos de nuestros componentes personalizados con nuestra marca.

Cómo usar Laboratoria UI en algún proyecto

Integre con su aplicación React

Primero, importa nuestras fuentes

Bitter para los títulos y Open Sans para los textos

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Bitter:400,700|Open+Sans:400,400i,700" />

Por último, importe laboratoria-ui, tema de Material-UI

import React from 'react';
import ReactDOM from 'react-dom';

// Inject a theme into your application
import { ThemeProvider } from '@material-ui/core/styles';

// Our theme
import { Theme } from 'laboratoria-ui';

import Typography from '@material-ui/core/Typography';
import Login from 'laboratoria-ui';

ReactDOM.render(
  <ThemeProvider theme={Theme}>
    <div>
      <Typography variant="h1" align="center">
        ¡Hola!
      </Typography>

      <Login/>
    </div> 
  </ThemeProvider>
  document.getElementById('app'),
);

Cómo arrancar el Storybook para poder aportar nuevos componenetes

Instala el proyecto

# clona repo desde tu fork
git clone [email protected]:<github-username>/ui.git

# entra en directorio de tu copia local del repo
cd ui

# instala las dependencias de Node.js declaradas en `package.json`
yarn install

# arranca localmente
yarn start

Esto arrancará la aplicacion en localhost:8080, verás el Storybook que es donde se enlistan todos los componentes que tenemos hasta el momento.

Más detalles

Si deseas obtener más información sobre el proceso de desarrollo, el flujo de trabajo, etc. Consulta la documentación completa en la Wiki.

Team

Devs: Todo el equipo de developers de Laboratoria

Soporte

Si encuentras algún bug, abre un issue aquí https://github.com/Laboratoria/ui/issues