Code Monkey home page Code Monkey logo

password-generator's Introduction

¡Contribuye a un proyecto de código abierto!

🚀 Soluciona el reto y participa en la Hacktoberfest

GitHub stars GitHub issues GitHub pull requests GitHub pull requests

🤔 ¿Qué es la Hacktoberfest?

La Hacktoberfest es un evento anual organizado por DigitalOcean y DEV, que consiste en contribuir a proyectos de código abierto y ganar una camiseta gratis.

🚀 ¿Cómo participar?

🚧 Necesitarás la extensión Astro para Visual Studio Code y Nodejs 16+.

  1. Regístrate en Hacktoberfest:
  • Clic en Start Hacking.
  • Inicia sesión con GitHub o GitLab.
  1. Crea un fork de este repositorio:
  • Clic en Fork en la esquina superior derecha o haz click aquí.
  1. Clona el repositorio:
git clone [email protected]:TU_USUARIO/hacktoberfest-2022.git
  1. Instala las dependencias:
npm install
# o
pnpm install
# o
yarn install
  1. Crea una página en:
/pages/entry/<tu-nombre-de-usuario-en-github>/index.astro
  1. Ejecuta el proyecto:
npm run dev
# o
pnpm run dev
# o
yarn dev
  1. Soluciona el reto que se indica en la página principal y happy hacking 🥳.

📝 Reglas

  • ✅ Puedes usar cualquier framework dentro de esta lista: React, Vue, Svelte, Preact y Solid. También puedes usar Vanilla JavaScript.
  • ❌ NO puedes usar dependencias de terceros. Nada de npm install, ni yarn add ni similares.
  • ✅ Se puede utilizar CSS y Tailwind pero...
  • ❌ NO se puede utilizar otro framework CSS como Bootstrap, Bulma, NextUI, Material UI, etc... ni tampoco SASS, Stylus o similares.
  • ❌ No copies soluciones de otros participantes o soluciones de fuera. ¡La idea es que practiques y te esfuerces!
  • ✅ Crea tus PRs del 1 al 31 de octubre.
  • ❌ No uses ni modifiques código o componentes de otros participantes.
  • ❌ No modifiques código de fuera de tus carpetas (a no ser que sea exactamente para arreglar un problema de la página).
  • ❌ NO USES ESTILOS GLOBALES. NO ESTILES etiquetas. Usa siempre un selector muy específico (por ejemplo, una id con tu nombre) y a partir de ahí estila lo que quieras de tu solución. Así evitamos conflictos entre estilos.
  • ✅ Si necesitas crear componentes auxiliares para tu solución, crea una carpeta en:
 components/<nombre-de-usuario-en-github>/*

🎁 Premios

Además de poder conseguir la camiseta de la Hacktoberfest, haremos una votación para elegir las mejores soluciones. Los premios son:

📝 Notas

Si usas Solid o Preact, debes indicar el jsxImportSource en un comentario pragma. Haz esto en la primera línea de cada archivo JSX/TSX.

// Para Preact
/** @jsxImportSource preact */

// Para Solid
/** @jsxImportSource solid-js */

Para poder ejeuctar solo los test que esten en tus carpetas tienes que ir al archivo jest.config.js y modifica el parametro testMatch

{
	"testMatch": ["**/<tu-nombre-de-usuario-en-github>/**/*.spec.{js,ts}"]
}

Nota: tendras que deshacer este cambio antes de hacer commit


Más información al respecto aquí.

🤗 Contribuidores

password-generator's People

Contributors

adamelamrani avatar agutierrezr avatar buhodev avatar cmglezpdev avatar codingcodax avatar danizt avatar devenapuros avatar diegocadavid avatar dpuentel avatar drzz21 avatar eduardoguette avatar enriquepivotree avatar eyubkh avatar fedmg avatar fredoist avatar halivert avatar jaavierr avatar jantoniodev avatar johansantana avatar jorbelca avatar juanpablo-is avatar maadeval avatar marsidev avatar midudev avatar mkeort avatar oswaldev avatar pheralb avatar serginogal avatar slydragonn avatar william-vp avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

password-generator's Issues

Eliminar dependencias de Lit y corregir typo

  • Eliminar dependencias de Lit
    En el último stream, Lit dio problemas, por lo que se tuvo que eliminar su integración en astro.config.mjs, sin embargo, no se han eliminado las dependencias lit y @astrojs/lit, e incluso se menciona en la landing que se puede resolver el reto usando Lit. No queda claro si se puede usar o no.
    image

  • Reemplazar Javascript por JavaScript
    image

JavaScript out of memory | Angular compiler

Hi guys,

I just cloned the repository, installed the dependencies and run the npm run dev command and when i try to visit the homesite... node fails with an out of memory after a lot of issues from angular compiler.

Angular compiler errors Out of memory
image image

My first thought was... oh I just need to install the react types the console was asking for, but after doing it I'm in the same spot, the node continues failing for the same cause.

Angular compiler errors Out of memory
image image

My specs:

  • Windows 11
  • Powershell 7.2.6 or Bash 4.4.23

Principiante en apuros con Vue.js

Hola buenas 👋,
Para este reto me he atrevido a probar Vuejs 💪 y estoy un poco perdido 😵.

He estado investigando todo lo que he podido sobre un problema que tengo pero aun no he encontrado la solución.

Espero que aparezca alguien con más experiencia con Vue para decirme lo que estoy haciendo mal.

Mi problema es el siguiente:

Yo tengo este componente creado para lo del range/slider que te indicará el numero de caracteres de la contraseña.

imagen

<template>
	<span class="flex justify-center items-center text-3xl">Length:</span> 
		<div class="flex justify-between w-full">
			<input v-model="value" type="range" class="w-5/6" :min="min" :max="max"/>
			<span class="text-center text-3xl p-4 bg-cyan-500 rounded-full aspect-square">{{value}}</span>
		</div>
</template>
<script>
	export default{
		name:'Length',
		data(){
			return{
				value: 0,min: 0, max: 100,}		
		}
}
</script>
<style>

</style>

La cosa es que si yo muevo el input, el valor no se actualiza, aun que tengo puesto lo del v-model. No estoy seguro si me faltaria algo pero he estado investigando un par de dias y no doy con ello.

imagen

Muchas gracias de antemano 👍.

Agregar hacktoberfest o hacktoberfest-accepted a los labels disponibles

Se necesita agregar las etiquetas mencionadas en el titulo ya que a si lo indica la pagina oficial del hacktoberfest

Your PR/MRs must be in a repo tagged with the “hacktoberfest” topic, or be labeled “hacktoberfest-accepted.”
Hacktoberfest is now opt-in for maintainers, so only contribute to projects that indicate they’re looking for Hacktoberfest PR/MRs.

Once your PR/MR has passed this check, we won’t check this again (unless your PR/MR fails a check before this, such as it being marked as spammy).

Error ejecutando "npm run build" en el entry de maxwolts

Al hacer un "npm run build" genera un error en este entry:

El error parece estar en la referencia
image

El archivo index.astro intenta importar PasswordGenerator en '@components/maxwolts/PasswordGenerator' (sin extensión) y existen dos archivos y ninguno de los dos exporta PasswordGenerator.

image

@MaxWolts, ¿podrías echarle un ojo?
Gracias.

B

T

Remove pre commit lint hook

Currently when we commit some changes, husky try to lint all the project:

image

This can modify the code of different participants if them are not linted properly.

I suggest remove this hook, or, customize it to only lint/modify the user code (if possible).

@RafaelLozano Conflictos de estilos

Hola 👋 @RafaelLozano ,

He detectado que tus estilos definidos en el archivo Button.css están entrando en conflicto con los míos.

Por favor, ¿Podrias arreglarlo? Te sugiero varias opciones por si te sirven:

  • Encerrar tu contenido en un div con tu id de GitHub y luego utilizarlo para los estilos, para que no aplique a otros códigos.
  • Hacer referencia al botón a través de un Id único.
  • Utilizar CSS modules

Un saludo, muchas gracias

Conflicto entre diferentes estilos @zerok1986

Buenos dias 👋,

@zerok1986 tengo un problema con este estilo que has definido en tu App.css, concretamente para el elemento h1. Adjunto el estilo:

image

Mi problema es que está entrando en conflicto para los que he definido yo para mi h1 de forma no global. Adjunto evidencias:

image

Por favor, ¿Podrias arreglarlo? Te doy algunas ideas aunque seguramente que haya mejores !!!

  • Encerrar tu contenido en un div con tu id de GitHub para que no aplique a otros códigos.
  • Hacer referencia al h1 a través de un Id único.
  • Utilizar CSS modules

Un saludo, muchas gracias

Lint errors

Hay muchos errores de lint en el código de los distintos participantes, seguramente algunos de ellos no tienen instalado la extensión de eslint y por eso no se dan cuenta. Aquí un ejemplo de uno de ellos:
image

Propongo lo siguiente:

  • Sugerir la extensión de eslint y prettier en .vscode/extensions.json
  • Agregar scripts lint:fix y format
  • Indicar en el readme o en la landing que deben formatear su código antes de hacer la PR, ejecutando los scripts lint:fix y format
    • Preferiblemente un comando personalizado como npx eslint src/pages/entry/<user>/** src/components/<user>/**
  • Agregar un github actions para ejecutar estos scripts también al hacer PRs. Se puede usar el de la miduconf como referencia
  • No mergear PRs que no pasen el CI
  • Agregar soporte de eslint a más frameworks (svelte, vue). Actualmente, el eslint solo está funcionando en archivos javascript, typescript, .jsx, .tsx y .astro

Por otro lado, intenté ejecutar npx eslint . para saber cuantos errores/warns había y obtuve este error

RangeError: Maximum call stack size exceeded
Occurred while linting C:\...\hacktoberfest-2022\src\pages\entry\charlesvp15\index.astro:1
Rule: "indent"

No sé porqué sucede, pero el error desaparece al remover o minificar un pedazo de svg que hay en ese archivo.
Después de resolver el problema del svg y ejecutando el eslint otra vez, finalmente pude ver la cantidad de errores:
image

Error de lint Vue

Estoy usando v-model con un array en vue pero me da un error de lint de algo de react

image
image

Mi pull request fue excluido del hacktoberfest 😢

Acabo de revisar en la pagina del hacktoberfest si mi contribución fue valida y lamentablemente no lo fue.
Al parecer las contribuciones a este repositorio no van a ser validas para el hacktoberfest. Aun asi me siento feliz de haber participado, fue una gran experiencia 😃

image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.