Codepen es una de las plataformas más geniales de las que has oído hablar, Codepen permite a los desarrolladores front-end y desarrolladores web jugar con código y ver los cambios al instante, y Codepen también proporciona inspiración para sus proyectos front-end y de desarrollo web.
¿Por qué es esencial Codepen para cada desarrollador web? ¿Por qué usar Codepen? y como usar Codepen? Bueno, estas son las preguntas que giran en torno a cada desarrollador front-end que escuchó un poco de este sitio en línea llamado CodePen.
CodePen es una plataforma en línea para diseñadores y desarrolladores front-end. Les permite construir su proyecto, buscar inspiración en otros códigos disponibles y también puede compartirlo.
- ¿Por qué hay una gran demanda de desarrolladores de software?
- ¿Qué compañía de software proporciona el software de administración de contactos gratuito más robusto y fácil de usar?
- ¿Deberían las casas de desarrollo de software publicar sus precios abiertamente?
- ¿Cuál es el mejor, iPad o MacBook, para desarrolladores?
- ¿Qué tan importante es Linux para los desarrolladores de software?
En CodePen, el equipo se describe a sí mismo como “Zona de juegos para el lado frontal de la web”. Mientras tanto, CodePen es una herramienta fantástica para probar errores en el código, colaborar con el otro y encontrar el mejor diseño disponible para obtener un poco de inspiración inicial, ya que para cada diseñador web obtener un buen diseño de referencia para la inspiración es tan importante como codificar el proyecto real.
Comenzando con CodePen
Para comenzar con CodePen, primero debe crear “Bolígrafos”, que son un conjunto de HTML, CSS y JS. Después de eso, puede mostrar esos bolígrafos en su perfil de CodePen, también puede obtener comentarios de sus pares y continuar construyendo y editando esos bolígrafos en cualquier momento simplemente registrándose en el sitio CodePen.
CodePen es una plataforma de código abierto, junto con la capacidad de mostrar la vista previa en vivo de cualquier cambio de código e incluso permite a los desarrolladores incrustar sus demostraciones de CodePen en cualquier página web simplemente usando su función de incrustación de lápiz.
Principales características de CodePen
CodePen tiene una característica sobresaliente que ayuda a esta plataforma genial a sacarla de su liga, y estas son algunas de las mejores características de CodePen que debe verificar si no lo ha hecho antes.
Así que, aquí vamos,
1. CodePen admite toneladas de Framework para HTML, CSS y Javascript
CodePen admite una amplia gama de marcos de trabajo de HTML, CSS y JavaScript. Por ejemplo: para HTML, puede usar HAML, Slim, Markdown o incluso Jade. Para CSS, admiten SCSS y Sass (ambos con un complemento opcional de Compass o Bourbon), así como Less y Stylus.
Como en la captura de pantalla, puede ver que en el menú JavaScript, puede seleccionar CoffeeScript o LiveScript. También hay un menú desplegable donde puede tener la última versión de cosas como jQuery y AngularJS.
2. Etiquetas y colecciones
CodePen también permite agregar etiquetas a su pluma para que los motores de búsqueda puedan buscarlas. Por un instante, las etiquetas como “Loader” y “Form” pueden mostrar una gran cantidad de código de diseño que puede usarse como inspiración para el proyecto.
Además, puede crear colecciones para cierto tipo de bolígrafos.
3. Opciones de CSS
CodePen CSS tiene una funcionalidad efectiva para ayudar a escribir CSS más rápido. Simplemente haciendo clic en un botón de opción puede seleccionar incluir Normalize.css o Reset.css en su CSS. También puede optar por usar prefijo-free o Autoprefixer también. Para que no necesite tomarse el tiempo para vincular a un archivo externo (que también es posible, si así lo desea). Lea más aquí ¿Cómo y por qué usar CodePen para proyectos web? – Enzuke