¡Hola!
Este año es mi primera vez que participo en el Hacktoberfest y quiero dejar algunos de mis proyectos por si alguien desea contribuir.
1️⃣ Fruits API
Una API con datos de árboles frutales.
Stack:
- JavaScript
Franqsanz
/
fruits-api
🍉 🍎 A GraphQL API with fruit tree data. Built with 🚀 Apollo Server Lambda + Netlify Lambda.
Fruits API
Other Language
GraphQL API with fruit tree data This API is built with Apollo Server Lambda + Netlify Lambda.
In this project I am not using a database The data is in data.js, in case you want to add more information :)
Contribute
Read the CONTRIBUTING.md file or check if there are any issues, all PRs are welcome.
URLs
Playground: https://fruits-api.netlify.app/graphql
Web: https://fruit-api.netlify.app/
Get the code for this project
- Clone repository:
git clone https://github.com/Franqsanz/fruits-api.git
- Enter to the repository directory:
cd fruits-api
- Install all dependencies:
npm install
# Or with yarn
yarn
- Once all the dependencies are installed run the following command:
npm start
yarn start
- Run Testing (optional):
npm test
yarn test
As an alternative, you can use Docker
- Open your terminal/command line
- Run
docker-compose up
Once the API is executed, if all goes well you should see in your terminal the following…
2️⃣ BoxShadows.css
Una mini librería CSS de sombras.
Stack:
- CSS
- JavaScript
Franqsanz
/
box-shadows.css
Mini librería de sombras.
BoxShadows.css
Mini librería CSS de sombras.
Instalación
npm i box-shadows
O descarga el archivo desde la web: https://cssshadows.netlify.app/
Modo de uso
1. Ejemplo con Styled Components:
import styled from "styled-components";
import { sw_b_20_b } from "box-shadows";
const Card = styled.div`
width: 200px;
height: 200px;
box-shadow: ${sw_b_20_b};
`;
2. De forma tradicional:
La forma de utilizar esta librería es como cualquier archivo CSS. Solo debes enlazarlo en el <head>.
Ejemplo:
<head>
<link rel="stylesheet" href="./shadows.min.css">
</head>
❗ ATENCIÓN ❗
Solo hay clases no puedes usar
id.
Entonces debes llamar los class desde las etiquetas que utilizes.
Por ejemplo un <div>.
Color de la sombra
#CACACArgb(202, 202, 202)hsl(0, 0%, 79%)
Tipos de clases disponibles
- Clases con efecto
Blur. - Clases con efecto
Solid. - Clases con…
3️⃣ Regexs
Un pequeño paquete NPM de expresiones regulares.
Stack:
- JavaScript
Regexs
Es un paquete de Expresiones Regulares, que construí con el objetivo de uso personal, pero cualquiera puede utilizarlo.
Voy a ir recopilando Expresiones Regulares con el tiempo.
Si te gustaría contribuir para agregar algunas más, puedes hacer un PR. en GitHub. :)
Instalación
$ npm install regexs
Modo de uso
const regexs = require('regexs');
// También pudes utilizar "Destructured Object"
const { numberCommas, rmAccents } = require('regexs');
// O con import
import regexs from 'regexs';
import { numberCommas, rmAccents } from 'regexs';
// Agregar comas a cifras numéricas.
// Por ejemplo:
const numero = numberCommas(50000);
console.log(numero); // 50,000
// Quitar acentos.
// Por ejemplo:
const acentos = rmAccents('perfección');
console.log(acentos); // perfeccion
Tipos de expresiones regulares disponibles:
…Happy Coding!
Top comments (0)