Code Monkey home page Code Monkey logo

sorteo-equipos's Introduction

Sorteo equipos Fifa

Descripción

Esta webapp permite realizar un sorteo de equipos de fútbol para el juego FIFA o cualquier simulador de futbol virtual.

Permite tanto obtener 2 equipos aleatorios random como también poder ingresar nombres de personas y asignarles un equipo aleatorio. Esta última funcionalidad contempla tanto el 1vs1 como el 2vs2.

Los equipos que se sortean son los populares que se suelen utilizar en el juego FIFA, tanto de clubes como de selecciones, esto sería de 5 estrellas ⭐⭐⭐⭐⭐ o bien de 4 y 1/2 pero con alto potencial.

screen

Instalación

Clonar el repositorio

git clone https://github.com/fedekrenn/sorteo-equipos.git

Instalar dependencias

pnpm install

Iniciar el servidor

pnpm start

Requisitos

  • Node.js 16x o superior
  • pnpm

Quieres contribuir al proyecto?

Visita el archivo CONTRIBUTING.md para obtener más información sobre cómo contribuir al proyecto.

Uso

1vs1

Se debe acceder al botón "1 vs 1", luego se elige la cantidad de jugadores y se ingresa el nombre de cada uno. Una vez ingresados los nombres, se debe clickear en "Sortear" y se mostrará el equipo asignado a cada jugador.

example-1

2vs2

Similar a la opción anterior, se debe acceder al botón "2 vs 2", luego se elige la cantidad de jugadores y se ingresa el nombre de cada uno. Luego clickear en "Sortear" y se mostrarán las parejas de jugadores y el equipo asignado a cada uno. En el caso de ser número impar quedará un jugador "Libre" para que luego pueda ser asignado a un equipo según se desee.

example-2

Random

Ingresar al botón "Equipos aleatorios" y clickear en "Sortear" para obtener 2 equipos aleatorios.

example-3

Funcionalidad por países

En cualquiera de las opciones anteriores tenemos el check "¿Incluir países?", el cual es opcional. Si se selecciona, se mostrarán selecciones en vez de equipos de clubes.

example-4

Tecnologías

  • React
  • Flowbite
  • Sonner
  • Tailwind CSS

🙋‍♂️ Hola, Soy Federico Krenn

🤓 Desarrollador web Fullstack
👨‍🎓 Realizando la Tecnicatura en Desarrollo Web en ISPC y Tecnicatura en Software Libre en la UNL
📫 Conectemos en Linkedin: https://www.linkedin.com/in/fkrenn/

sorteo-equipos's People

Contributors

fedekrenn avatar

Watchers

 avatar

sorteo-equipos's Issues

Feedback al usuario

Una vez realizado el sorteo, se podría dar un feedback al usuario, ya sea aprovechando el uso de sonner o bien incluyendo alguna librería como confetti

Desplazamiento pantalla

Concretado el sorteo, este se muestra al final de la página pero el usuario tiene que scrollear hasta abajo, por lo que lo mejor sería que se haga un focus a la section donde están los resultados

sorteo

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.