CSS Dare I, Post-compo

PiradoIV

Más de 100 personas registradas para echarle un ojo al concurso, 70 plantillas empezadas, más de 300 tweets, 408 follows, 86 ficheros de CSS, 21 hashtags y...

¡11.059 lineas de CSS!

Así que antes de nada, muchísimas gracias por participar, la acogida ha sido espectacular para ser algo tan improvisado. Muchísimas gracias también a toda la gente que ha aconsejado y dado sugerencias, beta testing, donado premios y demás :)

Este es el hilo original: http://www.mediavida.com/foro/dev/primer-css-dare-497101

Vota por tu favorito

Las votaciones ya están abiertas, tienes más información aquí:
http://www.mediavida.com/foro/dev/primer-css-dare-497101/6#171

¿Cómo se hizo?

Creé Twittard en unas cuantas tardes libres con CodeIgniter (un framework MVC para PHP) y MySQL, usando Datamapper ORM para las relaciones entre modelos.

Para los que os pique la curiosidad con las rutas, CodeIgniter permite personalizarlas mediante /application/config/routes.php. En el caso de Twittard, este es el fichero:

<?php
$route['default_controller']    = 'welcome';
$route['404_override']          = '';
$route['@(:any)/tweets/(:num)'] = 'users/tweets/$1/$2';
$route['@(:any)/followers']     = 'users/followers/$1';
$route['@(:any)/following']     = 'users/following/$1';
$route['@(:any)/mentions']      = 'users/mentions/$1';
$route['@(:any)']               = 'users/profile/$1';
$route['t/(:any)']              = 'tags/search/$1';

Todas las plantillas se guardan en la base de datos y se generan automáticamente cuando el usuario hace la petición, juntando todos los estilos en un mismo fichero. Para optimizar, he usado la caché de CodeIgniter para que se generen nada más que una vez o cuando el autor la actualiza.

Esta idea la puedes usar incluso para el HTML y el JavaScript de tu página. Podrías incluso minificar el resultado a la hora de generarlo, llevar un control de revisiones, etc.

El editor de plantillas se llama CodeMirror y está liberado como Open Source bajo licencia MIT. Entre otras cosas, soporta exportar el historial de deshacer, para guardarlo en una base de datos e importarlo más adelante.

Para hacerlo todo más sencillo y que no sea horrible de subir los cambios al servidor, me he ayudado de Git en el desarrollo. El servidor de git elegido ha sido BitBucket, ya que ofrece proyectos privados gratis.

En el servidor lo he dejado todo preparado para que simplemente haga falta hacer un git pull del branch master para tener la última versión del código.

Resultados

Todo este trabajo para convertir esta horrible página sin estilo alguno:

En auténticas obras de arte:

¡Y muchas más!, en serio, felicidades.

Poco más que contar, si tienes cualquier duda sobre el desarrollo o se te ocurre alguna idea brillante para el siguiente reto, envíame un mensaje y lo montamos =)

¡Saludotes!,

Pirado IV estuvo akí ;)

20
suikoji

Increíble, me encanta el desarrollo web y estos chicos tienen mucho talento, si señor, esto inspira!

Jastro

#1 Grande, menudo tute te has pegado, pero la verdad es que ha molado un monton, sobre todo el spam gratuito que ibamos haciendo a veces jajajajaj :D

Chaktet

No me mateis por subnormal, pero se puede poner en twitter?

2 respuestas
Nucklear

#4 Obviously no

BH99

#4 Twittard es una plataforma independiente y sin animo de lucro ajena a Twitter y a todo su política recaudatoria por lo que no son compatibles los temas para twitter.

Espero haber resultado de ayuda, por favor, no olvides votar mi post.

1
NuKeD

Enhorabuena a todos, los diseños son increibles.

syst3m-

Buah me encantan los diseños, enhorabuena chicos.

Pagaría por unas clases de css html5 javascript! voy a buscar en segundamano a ver si alguien da clases :)

2
2 meses después
Radi30

La p... madre, pero ke nivelazo hay por aki no?
No habia visto los resultados jaja
Mis enhorabuenas a todos los participantes
Aprovecho para preguntar una dudilla a los amantes del CSS, es cierto ke ahora ya no se manejan los pixeles como unidad de medida? ke es mucho mas aconsejable "em" o "%"?

Salu2!

7 meses después
Encofrado

En un intento de reflotar esto, tenéis pensado hacer otra css dare?

1 respuesta
gonya707

#10 El mes que viene empezamos...!

4
DarkSoldier

yuhu!

Usuarios habituales

  • DarkSoldier
  • Encofrado
  • Radi30
  • syst3m-
  • Nucklear
  • Chaktet
  • Jastro