React projects for beginners

React Project para repositorio para principiantes

¡Bienvenido al Proyecto React para el Repositorio de principiantes! Este es un lugar especial para principiantes apasionados por el aprendizaje y contribuir a reaccionar proyectos de código abierto JS. (85 ++ proyectos)

Nota#1: Verifique su proyecto cuidadosamente, debe estar libre de errores, su proyecto será revisado, si el revisor encontró algún error que su solicitud se marcará como "inválida".

Nota#2: No olvide enumerar su proyecto en el archivo `Projects.js` en la carpeta raíz del repositorio. También puede agregar el enlace de demostración de su proyecto (si corresponde)

Nota #3: Lea las pautas de gestión del tamaño de un repositorio.

Descripción

Este repositorio sirve como una plataforma para el proyecto React para los participantes principiantes que están en su viaje para dominar React JS y quieren contribuir por hacktoberfest. Es un lugar donde puede compartir sus mini proyectos, aprender de los demás y contribuir al crecimiento de la comunidad de código abierto.

Ya sea que haya creado una calculadora simple, una lista de tareas o una aplicación meteorológica, sus contribuciones son bienvenidas aquí. El objetivo principal de este repositorio es fomentar el aprendizaje y la colaboración entre los desarrolladores que son nuevos en reaccionar y contribuciones de código abierto.

¿Qué es Hacktoberfest?

Hacktoberfest es una celebración de un mes de software de código abierto dirigido por DigitalOcean. Está abierto a todos en nuestra comunidad global. Ya sea que sea un desarrollador, un estudiante que aprenda a codificar, un anfitrión de eventos o una empresa de cualquier tamaño, puede ayudar a impulsar el crecimiento del código abierto y hacer contribuciones positivas a una comunidad cada vez mayor. Se alienta a todos los antecedentes y niveles de habilidad a completar el desafío. Haga clic aquí para obtener información sobre Hacktoberfest

Proceso de contribución

1. Bifurca : Bifurca este repositorio de GitHub a su propia cuenta de GitHub 2. Clon : Clon el repositorio bifurcado (el repositorio presente en su cuenta) a su máquina local (Recordatorio: asegúrese de estar en el directorio donde desea que se almacene el repositorio).

 git clone https://github.com/ianshulx/React-projects-for-beginners

3.Cree una nueva rama

git checkout -b my-new-branch

4. Cambios : cree una nueva rama y comete sus cambios en esa rama. 5. Agregar y comprometer

• Agrega tus cambios

git add .

• Cometer sus cambios. (Recordatorio: asegúrese de que su mensaje relevante incluya el detalle necesario para comprender los cambios)

git commit -m "Relevant message"

6. Empuje : después de que se comprometan todos los cambios, presione sus cambios a su repositorio remoto.

git push origin my-new-branch

7. PR : Después de impulsar los cambios, recoja un PR de su repositorio remoto a la rama de desarrollo de este repositorio (Recordatorio: asegúrese de titular su PR adecuadamente para comprender el tema principal de su solicitud)

Al participar en este repositorio, no solo contribuirá al código abierto, sino que también mejorará sus habilidades en React JS. ¡Hagamos que el aprendizaje reaccione sea divertido e interactivo durante este OBERFEST! ¡Feliz codificación y feliz hacktoberfest!

Pautas de contribución

Asegúrese de seguir las pautas de contribución antes de hacer una solicitud de extracción. Las contribuciones de calidad son las que hacen de la comunidad de código abierto un lugar increíble para aprender, inspirar y crear.

Encuentre la lista completa de pautas en el archivo contribuyente.md.

Directrices de gestión del tamaño de un repositorio

Este repositorio aloja múltiples proyectos y, para garantizar un rendimiento sin problemas y una gestión eficiente, se deben seguir las siguientes pautas:

1. Limitación del tamaño del proyecto

• Cada carpeta de proyecto individual no debe exceder los 15 MB .
• Si un proyecto requiere más espacio debido a activos o datos adicionales, considere refactorizar el código o almacenar archivos externos en una ubicación separada (como el almacenamiento en la nube o las páginas GitHub).

2. Organización de archivos

• Los proyectos deben organizarse en carpetas claramente etiquetadas en el directorio raíz.
• Mantenga la estructura de la carpeta simple, por ejemplo, Project_name1/ , Project_name2/ , etc.

3. Evite grandes archivos binarios

• No comete grandes archivos binarios (por ejemplo, videos, imágenes de alta resolución, ejecutables compilados) directamente al repositorio.
• Use Git LFS (almacenamiento de archivos grandes) para archivos mayores de 100 MB o considere almacenar activos grandes fuera del repositorio y vincularlos.

4. Minimizar bibliotecas externas

• Minimice el uso de bibliotecas de terceros pesadas o dependencias externas.
• Use un archivo .gitignore para excluir archivos innecesarios o autogéneados (por ejemplo, node_modules/ , build/ , etc.).

5. Limpieza regular

• Realice una limpieza regular de archivos innecesarios (por ejemplo, registros, archivos temporales).
• Elimine código, activos o proyectos obsoletos o no utilizados del repositorio.

6. Compresión de activos

• Compresión de imagen : use herramientas como TinyPng, ImageOptim o Squoosh para comprimir imágenes (PNG, JPEG, etc.) antes de cometerlas.
  • Para imágenes web : use formatos apropiados como WebP para reducir significativamente el tamaño sin comprometer la calidad.
• Límite de resolución : evite usar imágenes de alta resolución innecesariamente. Para la mayoría de los proyectos react, una resolución de 72 ppp (puntos por pulgada) es suficiente para la web.
• Uso de SVG : use archivos SVG siempre que sea posible para los gráficos vectoriales, ya que son escalables y livianos.
• Comprima otros activos como PDF y archivos de audio utilizando herramientas de compresión sin pérdidas antes de agregarlos al repositorio para reducir el tamaño del archivo.

7. Optimizar el código para el rendimiento

• Poner y minificar : asegúrese de que la configuración de su proyecto utilice herramientas como Webpack o Vite para agrupar y minificar archivos JavaScript y CSS. Esto reduce los tamaños de archivo y acelera los tiempos de carga.
• Shaking de árboles : cuando use bibliotecas de terceros, asegúrese de importar solo las piezas necesarias (sacudidas de árboles) para evitar agrupar el código no utilizado.
  • Por ejemplo, prefiera import { Button } from 'library' en lugar de import * as Library from 'library' .

8. Versión e gestión de la historia

• Mantenga limpio el historial de confirmación evitando confirmaciones frecuentes de archivos innecesarios.
• Use mensajes de confirmación significativo y conciso.
• Si un proyecto se vuelve demasiado grande con el tiempo, considere dividirlo en un repositorio separado.

9. Contribuciones

• Para los contribuyentes, adhiera a los límites del tamaño del proyecto. Las grandes contribuciones deben discutirse a través de un problema o una solicitud de extracción.
• Asegúrese de que todas las contribuciones estén optimizadas para el tamaño y el rendimiento antes de enviarlas.

Código de conducta

Este proyecto se adhiere a los valores de Hacktoberfest ↗ y el Código de Conducta del Pacto de contribuyente ↗. Al participar, se espera que mantenga este código. Además de este proyecto

Licencia

Este repositorio tiene licencia bajo la licencia MIT.

El resumen de la licencia del MIT y qué no es:

Do's: Use el código en aplicaciones comerciales: por ejemplo, una empresa puede crear una pieza de software patentada que incluya todo o parte del código de código abierto original, luego cobrar dinero por ese software. Modifique el código: en otras palabras, los desarrolladores pueden cambiar/actualizar el código como desee. Distribuya copias del código y cualquier modificación: siempre que se incluya el aviso de derechos de autor original y la licencia en sí, una organización puede distribuir y vender copias o versiones modificadas del código. Sublicense El código: Esto significa que puede incorporar el código original en una modificación con una licencia más estricta.

Donk's: No se puede responsabilizar legalmente a los autores del código por ningún motivo. No se puede eliminar el aviso de derechos de autor y la licencia original de su versión del código.

¡Comencemos a contribuir y hagamos de la comunidad de código abierto un lugar mejor para todos!

React Project para repositorio para principiantes

¡Bienvenido al Proyecto React para el Repositorio de principiantes! Este es un lugar especial para principiantes apasionados por aprender y contribuir a proyectos de código abierto utilizando React JS. ¡Actualmente es Hacktoberfest!

Nota#1: Verifique su proyecto cuidadosamente, debe estar libre de errores, su proyecto será revisado, si el revisor encontró algún error que su solicitud se marcará como "inválida".

Nota#2: No olvide enumerar su proyecto en el archivo `Projects.js` en la carpeta raíz del repositorio. También puede agregar el enlace de demostración de su proyecto (si corresponde)

Nota#3: Lea [pautas de gestión de reposicionamiento] (https://github.com/iAnshulx/react-projects-for-beginners/blob/main/repo_size_guidelines)

Descripción

Este repositorio sirve como una plataforma para el proyecto React para los participantes principiantes que están en su viaje para dominar React JS y quieren contribuir por hacktoberfest. Es un lugar donde puede compartir sus mini proyectos, aprender de los demás y contribuir al crecimiento de la comunidad de código abierto.

Ya sea que haya creado una calculadora simple, una lista de tareas o una aplicación meteorológica, sus contribuciones son bienvenidas aquí. El objetivo principal de este repositorio es fomentar el aprendizaje y la colaboración entre los desarrolladores que son nuevos en reaccionar y contribuciones de código abierto.

¿Qué es Hacktoberfest?

Hacktoberfest es una celebración de un mes de software de código abierto dirigido por DigitalOcean. Está abierto a todos en nuestra comunidad global. Ya sea que sea un desarrollador, un estudiante que aprenda a codificar, un anfitrión de eventos o una empresa de cualquier tamaño, puede ayudar a impulsar el crecimiento del código abierto y hacer contribuciones positivas a una comunidad cada vez mayor. Se alienta a todos los antecedentes y niveles de habilidad a completar el desafío. Haga clic aquí para obtener información sobre Hacktoberfest

Proceso de contribución

1. Bifurca : Bifurca este repositorio de GitHub a su propia cuenta de GitHub 2. Clon : Clon el repositorio bifurcado (el repositorio presente en su cuenta) a su máquina local (Recordatorio: asegúrese de estar en el directorio donde desea que se almacene el repositorio).

 git clone https://github.com/ianshulx/React-projects-for-beginners

3.Cree una nueva rama

git checkout -b my-new-branch

4. Cambios : cree una nueva rama y comete sus cambios en esa rama. 5. Agregar y comprometer

• Agrega tus cambios

git add .

• Cometer sus cambios. (Recordatorio: asegúrese de que su mensaje relevante incluya el detalle necesario para comprender los cambios)

git commit -m "Relevant message"

6. Empuje : después de que se comprometan todos los cambios, presione sus cambios a su repositorio remoto.

git push origin my-new-branch

7. PR : Después de impulsar los cambios, recoja un PR de su repositorio remoto a la rama de desarrollo de este repositorio (Recordatorio: asegúrese de titular su PR adecuadamente para comprender el tema principal de su solicitud)

Al participar en este repositorio, no solo contribuirá al código abierto, sino que también mejorará sus habilidades en React JS. ¡Hagamos que el aprendizaje reaccione sea divertido e interactivo durante este OBERFEST! ¡Feliz codificación y feliz hacktoberfest!

Pautas de contribución

Asegúrese de seguir las pautas de contribución antes de hacer una solicitud de extracción. Las contribuciones de calidad son las que hacen de la comunidad de código abierto un lugar increíble para aprender, inspirar y crear.

Encuentre la lista completa de pautas en el archivo contribuyente.md.

Directrices de gestión del tamaño de un repositorio

Este repositorio aloja múltiples proyectos y, para garantizar un rendimiento sin problemas y una gestión eficiente, se deben seguir las siguientes pautas:

1. Limitación del tamaño del proyecto

• Cada carpeta de proyecto individual no debe exceder los 15 MB .
• Si un proyecto requiere más espacio debido a activos o datos adicionales, considere refactorizar el código o almacenar archivos externos en una ubicación separada (como el almacenamiento en la nube o las páginas GitHub).

2. Organización de archivos

• Los proyectos deben organizarse en carpetas claramente etiquetadas en el directorio raíz.
• Mantenga la estructura de la carpeta simple, por ejemplo, Project_name1/ , Project_name2/ , etc.

3. Evite grandes archivos binarios

• No comete grandes archivos binarios (por ejemplo, videos, imágenes de alta resolución, ejecutables compilados) directamente al repositorio.
• Use Git LFS (almacenamiento de archivos grandes) para archivos mayores de 100 MB o considere almacenar activos grandes fuera del repositorio y vincularlos.

4. Minimizar bibliotecas externas

• Minimice el uso de bibliotecas de terceros pesadas o dependencias externas.
• Use un archivo .gitignore para excluir archivos innecesarios o autogéneados (por ejemplo, node_modules/ , build/ , etc.).

5. Limpieza regular

• Realice una limpieza regular de archivos innecesarios (por ejemplo, registros, archivos temporales).
• Elimine código, activos o proyectos obsoletos o no utilizados del repositorio.

6. Compresión de activos

• Compresión de imagen : use herramientas como TinyPng, ImageOptim o Squoosh para comprimir imágenes (PNG, JPEG, etc.) antes de cometerlas.
  • Para imágenes web : use formatos apropiados como WebP para reducir significativamente el tamaño sin comprometer la calidad.
• Límite de resolución : evite usar imágenes de alta resolución innecesariamente. Para la mayoría de los proyectos react, una resolución de 72 ppp (puntos por pulgada) es suficiente para la web.
• Uso de SVG : use archivos SVG siempre que sea posible para los gráficos vectoriales, ya que son escalables y livianos.
• Comprima otros activos como PDF y archivos de audio utilizando herramientas de compresión sin pérdidas antes de agregarlos al repositorio para reducir el tamaño del archivo.

7. Optimizar el código para el rendimiento

• Poner y minificar : asegúrese de que la configuración de su proyecto utilice herramientas como Webpack o Vite para agrupar y minificar archivos JavaScript y CSS. Esto reduce los tamaños de archivo y acelera los tiempos de carga.
• Shaking de árboles : cuando use bibliotecas de terceros, asegúrese de importar solo las piezas necesarias (sacudidas de árboles) para evitar agrupar el código no utilizado.
  • Por ejemplo, prefiera import { Button } from 'library' en lugar de import * as Library from 'library' .

8. Versión e gestión de la historia

• Mantenga limpio el historial de confirmación evitando confirmaciones frecuentes de archivos innecesarios.
• Use mensajes de confirmación significativo y conciso.
• Si un proyecto se vuelve demasiado grande con el tiempo, considere dividirlo en un repositorio separado.

9. Contribuciones

• Para los contribuyentes, adhiera a los límites del tamaño del proyecto. Las grandes contribuciones deben discutirse a través de un problema o una solicitud de extracción.
• Asegúrese de que todas las contribuciones estén optimizadas para el tamaño y el rendimiento antes de enviarlas.

Código de conducta

Este proyecto se adhiere a los valores de Hacktoberfest ↗ y el Código de Conducta del Pacto de contribuyente ↗. Al participar, se espera que mantenga este código. Además de este proyecto

Licencia

Este repositorio tiene licencia bajo la licencia MIT.

El resumen de la licencia del MIT y qué no es:

Do's: Use el código en aplicaciones comerciales: por ejemplo, una empresa puede crear una pieza de software patentada que incluya todo o parte del código de código abierto original, luego cobrar dinero por ese software. Modifique el código: en otras palabras, los desarrolladores pueden cambiar/actualizar el código como desee. Distribuya copias del código y cualquier modificación: siempre que se incluya el aviso de derechos de autor original y la licencia en sí, una organización puede distribuir y vender copias o versiones modificadas del código. Sublicense El código: Esto significa que puede incorporar el código original en una modificación con una licencia más estricta.

Donk's: No se puede responsabilizar legalmente a los autores del código por ningún motivo. No se puede eliminar el aviso de derechos de autor y la licencia original de su versión del código.

¡Comencemos a contribuir y hagamos de la comunidad de código abierto un lugar mejor para todos!

React Project para repositorio para principiantes

¡Bienvenido al Proyecto React para el Repositorio de principiantes! Este es un lugar especial para principiantes apasionados por aprender y contribuir a proyectos de código abierto utilizando React JS. ¡Actualmente es Hacktoberfest!

Nota#1: Verifique su proyecto cuidadosamente, debe estar libre de errores, su proyecto será revisado, si el revisor encontró algún error que su solicitud se marcará como "inválida".

Nota#2: No olvide enumerar su proyecto en el archivo `Projects.js` en la carpeta raíz del repositorio. También puede agregar el enlace de demostración de su proyecto (si corresponde)

Nota#3: Lea [pautas de gestión de reposicionamiento] (https://github.com/iAnshulx/react-projects-for-beginners/blob/main/repo_size_guidelines)

Descripción

Este repositorio sirve como una plataforma para el proyecto React para los participantes principiantes que están en su viaje para dominar React JS y quieren contribuir por hacktoberfest. Es un lugar donde puede compartir sus mini proyectos, aprender de los demás y contribuir al crecimiento de la comunidad de código abierto.

Ya sea que haya creado una calculadora simple, una lista de tareas o una aplicación meteorológica, sus contribuciones son bienvenidas aquí. El objetivo principal de este repositorio es fomentar el aprendizaje y la colaboración entre los desarrolladores que son nuevos en reaccionar y contribuciones de código abierto.

¿Qué es Hacktoberfest?

Hacktoberfest es una celebración de un mes de software de código abierto dirigido por DigitalOcean. Está abierto a todos en nuestra comunidad global. Ya sea que sea un desarrollador, un estudiante que aprenda a codificar, un anfitrión de eventos o una empresa de cualquier tamaño, puede ayudar a impulsar el crecimiento del código abierto y hacer contribuciones positivas a una comunidad cada vez mayor. Se alienta a todos los antecedentes y niveles de habilidad a completar el desafío. Haga clic aquí para obtener información sobre Hacktoberfest

Proceso de contribución

1. Bifurca : Bifurca este repositorio de GitHub a su propia cuenta de GitHub 2. Clon : Clon el repositorio bifurcado (el repositorio presente en su cuenta) a su máquina local (Recordatorio: asegúrese de estar en el directorio donde desea que se almacene el repositorio).

 git clone https://github.com/ianshulx/React-projects-for-beginners

3.Cree una nueva rama

git checkout -b my-new-branch

4. Cambios : cree una nueva rama y comete sus cambios en esa rama. 5. Agregar y comprometer

• Agrega tus cambios

git add .

• Cometer sus cambios. (Recordatorio: asegúrese de que su mensaje relevante incluya el detalle necesario para comprender los cambios)

git commit -m "Relevant message"

6. Empuje : después de que se comprometan todos los cambios, presione sus cambios a su repositorio remoto.

git push origin my-new-branch

7. PR : Después de impulsar los cambios, recoja un PR de su repositorio remoto a la rama de desarrollo de este repositorio (Recordatorio: asegúrese de titular su PR adecuadamente para comprender el tema principal de su solicitud)

Al participar en este repositorio, no solo contribuirá al código abierto, sino que también mejorará sus habilidades en React JS. ¡Hagamos que el aprendizaje reaccione sea divertido e interactivo durante este OBERFEST! ¡Feliz codificación y feliz hacktoberfest!

Pautas de contribución

Asegúrese de seguir las pautas de contribución antes de hacer una solicitud de extracción. Las contribuciones de calidad son las que hacen de la comunidad de código abierto un lugar increíble para aprender, inspirar y crear.

Encuentre la lista completa de pautas en el archivo contribuyente.md.

Directrices de gestión del tamaño de un repositorio

Este repositorio aloja múltiples proyectos y, para garantizar un rendimiento sin problemas y una gestión eficiente, se deben seguir las siguientes pautas:

1. Limitación del tamaño del proyecto

• Cada carpeta de proyecto individual no debe exceder los 15 MB .
• Si un proyecto requiere más espacio debido a activos o datos adicionales, considere refactorizar el código o almacenar archivos externos en una ubicación separada (como el almacenamiento en la nube o las páginas GitHub).

2. Organización de archivos

• Los proyectos deben organizarse en carpetas claramente etiquetadas en el directorio raíz.
• Mantenga la estructura de la carpeta simple, por ejemplo, Project_name1/ , Project_name2/ , etc.

3. Evite grandes archivos binarios

• No comete grandes archivos binarios (por ejemplo, videos, imágenes de alta resolución, ejecutables compilados) directamente al repositorio.
• Use Git LFS (almacenamiento de archivos grandes) para archivos mayores de 100 MB o considere almacenar activos grandes fuera del repositorio y vincularlos.

4. Minimizar bibliotecas externas

• Minimice el uso de bibliotecas de terceros pesadas o dependencias externas.
• Use un archivo .gitignore para excluir archivos innecesarios o autogéneados (por ejemplo, node_modules/ , build/ , etc.).

5. Limpieza regular

• Realice una limpieza regular de archivos innecesarios (por ejemplo, registros, archivos temporales).
• Elimine código, activos o proyectos obsoletos o no utilizados del repositorio.

6. Compresión de activos

• Compresión de imagen : use herramientas como TinyPng, ImageOptim o Squoosh para comprimir imágenes (PNG, JPEG, etc.) antes de cometerlas.
  • Para imágenes web : use formatos apropiados como WebP para reducir significativamente el tamaño sin comprometer la calidad.
• Límite de resolución : evite usar imágenes de alta resolución innecesariamente. Para la mayoría de los proyectos react, una resolución de 72 ppp (puntos por pulgada) es suficiente para la web.
• Uso de SVG : use archivos SVG siempre que sea posible para los gráficos vectoriales, ya que son escalables y livianos.
• Comprima otros activos como PDF y archivos de audio utilizando herramientas de compresión sin pérdidas antes de agregarlos al repositorio para reducir el tamaño del archivo.

7. Optimizar el código para el rendimiento

• Poner y minificar : asegúrese de que la configuración de su proyecto utilice herramientas como Webpack o Vite para agrupar y minificar archivos JavaScript y CSS. Esto reduce los tamaños de archivo y acelera los tiempos de carga.
• Shaking de árboles : cuando use bibliotecas de terceros, asegúrese de importar solo las piezas necesarias (sacudidas de árboles) para evitar agrupar el código no utilizado.
  • Por ejemplo, prefiera import { Button } from 'library' en lugar de import * as Library from 'library' .

8. Versión e gestión de la historia

• Mantenga limpio el historial de confirmación evitando confirmaciones frecuentes de archivos innecesarios.
• Use mensajes de confirmación significativo y conciso.
• Si un proyecto se vuelve demasiado grande con el tiempo, considere dividirlo en un repositorio separado.

9. Contribuciones

• Para los contribuyentes, adhiera a los límites del tamaño del proyecto. Las grandes contribuciones deben discutirse a través de un problema o una solicitud de extracción.
• Asegúrese de que todas las contribuciones estén optimizadas para el tamaño y el rendimiento antes de enviarlas.

Código de conducta

Este proyecto se adhiere a los valores de Hacktoberfest ↗ y el Código de Conducta del Pacto de contribuyente ↗. Al participar, se espera que mantenga este código. Además de este proyecto

Licencia

Este repositorio tiene licencia bajo la licencia MIT.

El resumen de la licencia del MIT y qué no es:

Do's: Use el código en aplicaciones comerciales: por ejemplo, una empresa puede crear una pieza de software patentada que incluya todo o parte del código de código abierto original, luego cobrar dinero por ese software. Modifique el código: en otras palabras, los desarrolladores pueden cambiar/actualizar el código como desee. Distribuya copias del código y cualquier modificación: siempre que se incluya el aviso de derechos de autor original y la licencia en sí, una organización puede distribuir y vender copias o versiones modificadas del código. Sublicense El código: Esto significa que puede incorporar el código original en una modificación con una licencia más estricta.

Donk's: No se puede responsabilizar legalmente a los autores del código por ningún motivo. No se puede eliminar el aviso de derechos de autor y la licencia original de su versión del código.

¡Comencemos a contribuir y hagamos de la comunidad de código abierto un lugar mejor para todos!