7 Sitios Web para Ayudarte a Crear tus Proyectos FrontEnd

Muchas veces, cuando el programador autodidacta comienza a realizar cursos para aprender a codificar, con el paso del tiempo se empieza a encontrar con muchas limitaciones.

¿A qué se deben esas limitaciones? Muchas veces las personas que comienzan, son perfectamente capaces de comprender lo que hacen y seguir como otra persona lo hace, pero no son capaces de realizar su propio código único.

¿Cuál es la mejor fórmula para dar solución a esto?

Sin lugar a dudas, practicar, practicar y practicar. Si quieres encontrar la soltura suficiente para poder afrontar la situación de crear código por tu propia cuenta sin la necesidad de seguir a otra persona; necesitas crear tus propios proyectos.

Aquí es donde vamos a entrar hoy, aquí tienes algunos sitios desde los que puedes practicar o bien extraer ideas desde las que ponerte a practicar sin parar, ¡Al lío!

1. Prácticas de creación de interfaces

Lleve tus habilidades de frontend al siguiente nivel, recreando sitios web reales de compañías conocidas. Este es el tipo de práctica perfecto para desarrolladores de todos los niveles. ¿Estás preparado para el reto?

En este sitio web vas a encontrar 26 sitios web que tendrás que reproducir desde una guía de estilos que el propio sitio te ofrece.

VISITAR PRÁCTICAS DE FRONTEND

2. Construir desde cero

En este proyecto de Github, se presentan los mejores enlaces donde se explican las mejores prácticas y los puntos de partida que necesitas conocer para la creación de cualquier tipo de proyecto que desees comenzar.

Solamente accede, revisar la categoría que más te interese y echa un vistazo a los enlaces relacionados.

VISITAR CREADOR DESDE CERO

3. Repositorio de Proyectos React

A veces, la mejor fórmula para aprender es analizar código. Por eso, este repositorio de proyectos de React te va ayudar muchísimo a analizar la implementación de tus primeros proyectos.

VISITAR PROYECTOS DE REACT

4. 50 Proyectos en 50 días

Este sitio de Github busca ayudar a los principales en la tripleta básica del diseño web (HTML, CSS y Javascript) desde 50 sencillos proyectos pequeños, que vas a poder reproducir.

El objetivo es que analices cada uno de ellos, seas capaz de comprender los códigos y crear algo similar por tu propia cuenta. Quién sabe, si incluso algo más complejo.

VISITAR 50 PROYECTOS EN 50 DÍAS

5. Mentorías FrontEnd

Mejora tus habilidades de codificación front-end mediante la creación de proyectos reales. Resuelve los desafíos de HTML, CSS y JavaScript del mundo real mientras trabajas con diseños profesionales.

En este sitio vas a poder encontrar desafías y compartir tu propio desafío, el sitio busca poner en contacto a personas con el deseo de practicar y optimizar sus sitios y proyectos.

Por eso, se pueden acceder a proyectos a los que tendrás que dar tu retroalimentación y presentar mejoras.

VISITAR MENTORÍA FRONTEND

6. Javascript 30

El sitio de Javascript 30 no es la primera vez que lo recomiendo desde Ciberninjas.

El camino del Frontend Developer, por MrCodeDev

Pero bien, vamos allí una vez más, desde el sitio se ofrecen 30 vídeos de proyectos de Javascript (luego de registrarte) y aparte un avanzando curso de Javascript de pago.

No es un mal sitio, si quieres practicar las nociones de Javascript.

VISITAR 30 PROYECTOS DE JAVASCRIPT

7. Vanilla HTML, CSS y Javascript

Este repositorio presenta 20 proyectos no demasiado complicados que puedes analizar, revisar y reproducir. Realmente existen millones de páginas en las que podrías encontrar esto, pero..

¿Qué tiene de bueno este repositorio? Pues bien, lo bueno es que simplemente se usan HTML, CSS y Javascript puros. Sin ningún tipo de framework, ni librería añadidas.

Además, si lo deseas, el repositorio incluye un curso de Udemy paralelo, desde el que puedes ir siguiendo todo el contenido de creación.

VISITAR 20 PROYECTOS DE HTML, CSS Y JAVASCRIPT PUROS


Recuerda que puedes encontrar muchos más sitios, solamente debes revisar desde el buscador de nuestro sitio para ello, ¡Nos leemos! 🙂

Relacionado

17 Nuevos Cursos Gratuitos de SQL, Python, Diseño Web y Más (06 de Marzo)

Regreso con nuevos cursos gratis, recuerda que algunos de los cupones de los cursos publicados ayer, es muy posible que aún sigan activos; y vas a poder encontrar cursos en español de javascript -typescript, react,vue- y Unity. Además, de cursos en inglés de Python, R, SQL y más; también tienes muchos cursos totalmente gratis y una gran oferta de guías para programación de O´Reilly (en inglés) ¡SEGUIR LEYENDO!

21 Sitios y Aplicaciones Web para Mejorar en Diseño Web

Sitios web interesantes que se han lanzado utilizando los dominios de Google Registry. para ayudarte a impulsar tus habilidades durante todo el año. Vamos a ojear los siguientes 21 siguientes páginas formas para aprender Sitios con .new Collage.new: ¿Busca una nueva dirección en 2021? Crea un tablero de visión inspirador con BeFunky's Collage Maker. Resume.new: Si está buscando un nuevo trabajo este año, arregle su currículum ¡SEGUIR LEYENDO!

26 Nuevos Cursos GRATIS de Udemy: Python, Javascript, Flutter (cupón finalizado)

26 Nuevos cursos con cupones free de Udemy: En español (typescript,javascript, react, vue y videojuegos) e ingles (Python, Django, Javascript, R, SQL, Flutter, Java, Qt, Bootstrap, Illustrator y Photoshop). Cursos en Español ? Curso Gratis de Udemy: Aprende JavaScript y Jquery de 0 a 100 APÚNTATE ? Curso Gratis de Udemy: Aprende Typescript de 0 a 100 APÚNTATE ? Curso Gratis de Udemy: Aprende Vue + ¡SEGUIR LEYENDO!

40 Cursos Gratis de Udemy: Desarrollo Web, Python (cupón finalizado)

Recién llega la primavera y vamos con una publicación más, que incluye los cursos del Lunes; hoy tenemos, 9 cursos en español (Typescript, Javascript, React, Vue, Firebase, Swift, Azure, HTML y CSS, Power Bi). Más 31 cursos en inglés: Javascript, Typescript, React, Python, R, Java, Drupal, Android y Kotlin, Básicos de Visual Studio Code, Bootstrap, Gitlab, Maya 3D, Photoshop, Marketing en Facebook e Instagram, SEO. Iniciación ¡SEGUIR LEYENDO!

85 Geniales Recursos CSS Gratuitos

La lista de las siguientes geniales herramientas de CSS, se basa en el hilo de Twitter de @Prathkum. El listado se separa en herramientas de color, selectores de color integrados, fragmentos de código, documentos y notas, generadores de CSS, sitios de inspiración, repositorios de GitHub, validadores de CSS y más. ? Colección Recursos CSS / ? Cursos Gratis de CSS / ? Libros Gratis de CSS ¡SEGUIR LEYENDO!

¿Cómo alinear a la derecha en Bootstrap 4?

Bootstrap es un framework CSS que se utiliza para diseñar y personalizar sitios adaptables para dispositivos móviles. En Bootstrap 4, la alineación de elementos a la derecha se puede lograr usando cualquiera de las siguientes clases: Agregando la clase float-right La clase .float-right en Bootstrap usa la propiedad float CSS para colocar un elemento a la derecha. Debes tener en cuenta que el contenedor Bootstrap 4 ¡SEGUIR LEYENDO!

All Animation: Repositorio NPM de animaciones CSS

All Animation.css es un conjunto de animaciones css agradables y locas creadas con el propósito de darle vida e interacciones a su proyecto. Son animaciones de navegador que le pueden dar más énfasis a tus páginas, como controles deslizantes y efectos 3D. No dudes en ojearlo si necesitas alguna idea desde la que generar tus mejores efectos desde CSS. VISITAR ALL ANIMATION 20 Recursos para desarrolladores ¡SEGUIR LEYENDO!

¿Cómo Instalar WordPress Muy Fácil con Bitnami?

Vamos a revisar cómo se puede usar la aplicación de Bitnami para instalar WordPress. Es posible que hayas oído hablar mucho del servicio de Bitnami pero antes de entrar en el proceso de instalación, permíteme darte una breve introducción al respecto. ¿Por qué instalar Worpress desde una pila auto instalable? Normalmente, cuando deseas iniciar un sitio web de WordPress, necesitas comprar un dominio y un servicio ¡SEGUIR LEYENDO!

Bootstrap 5.2.0 agrega soporte para CSS y agrega componentes personalizados

Los constructores están ofreciendo las variables CSS para todos los componentes y nuevos ayudantes y utilidades dentro de la última actualización planificada para el framework de Bootstrap. Bootstrap v5.2.0-beta1, lanzado la semana pasada, se anuncia como el lanzamiento más importante del marco desde Bootstrap 5.0 hace dos años. Los componentes ahora tienen temas mejorados y variables CSS para la personalización en tiempo real. La compatibilidad con ¡SEGUIR LEYENDO!

Bootstrap 5: Nuevos cambios para el framework CSS más usado del mundo

¡Llegó el primer lanzamiento Alfa de Bootstrap 5! Desde el equipo de Bootstrap anuncian una nueva versión del framework, en la que han estado trabajando durante varios meses para definir lo que comenzaron con la versión 4. La nueva versión Alpha de Bootstrap 5 se centra en hacer que migrar de la versión 4 a la 5 sea más accesible, además de dejar atrás lo que ¡SEGUIR LEYENDO!

Lanzado Bootstrap 5: Una nueva versión estable del framework CSS

¡Bootstrap 5 ha sido lanzado oficialmente! Después de tres versiones alpha, tres betas y varios meses de arduo trabajo. Conjunto a varios lanzamientos de los iconos de bootstrap. El equipo de Bootstrap ha lanzado definitivamente la versión estable de Bootstrap 5. Documentación Actualizada de Bootstrap 5 Sigue leyendo para conocer los detalles sobre las nuevas novedades en la versión de Bootstrap 5. Nuevo logotipo de Bootstrap ¡SEGUIR LEYENDO!

Salir de la versión móvil