Cómo construir una gran aplicación web sin experiencia

Planifique el contenido que desea mostrar y para quién es. Averigua qué es y cómo alguien que lo quiere querría acceder a él, y cómo lo obtendrás / producirás. Comience a recopilar o crear contenido AHORA MISMO. Si va a ser generado por el usuario, establezca el tipo de contenido que desea que generen los usuarios.

En base a eso, piense en cómo puede estructurar todo para lograr el flujo y la experiencia esperados y previstos. Piense en el orden en que alguien podría pasar por esa estructura y considere qué información necesita estar allí en cualquier etapa. Luego, identifique la jerarquía y la ubicación de la información necesaria para cada etapa.

Compra tus dominios. Decidir sobre una pila de software. Obtener / crear espacio en el servidor que lo admita. Arrancar motores.

Considere todo lo que tiene ahora y comience a probar ideas sobre cómo lograrlo. Pequeñas piezas de ‘lógica de negocios’. Simultáneamente, comience a esbozar opciones estilísticas y requisitos de experiencia que tengan sentido para lo anterior. (CodePen es increíble para esto. También lo es hablar entre ellos, photoshop o un bolígrafo y papel / pizarra)

Limite o repita sus ideas, hasta que comiencen a encajar. Clasificar, eliminar y enfocar. Busca consistencia y tono claro, tanto en la interfaz como en otros. Comience a construir, teniendo en cuenta que todo lo que construya puede y se extenderá y considere los casos límite. Estás construyendo una base o un marco para todo lo que vendrá. (echa un vistazo a The HTML5 Boilerplate como un posible punto de partida)

Seguir construyendo, colaborar, revisarse mutuamente. Cuando surgen nuevas ideas, suena como que encajan, habla sobre ellas, pruébalas, dile a tus amigos que las prueben … y … si funcionan, funcionan, si no lo hacen, no lo hacen. De hecho, hazlo por todo lo que has construido hasta ahora.

Pausa y evalúa “¿Funciona todo como queríamos?” Verifique todo, desde los pasos uno a cuatro, luego mire lo que ha hecho hasta ahora. Haz un seguimiento de lo que cambió, lo que no y por qué. Averigüe si tiene nueva información. ¿Afecta algo? Asegúrate de estar contento con las cosas y recalibra. Luego, haga lo que deba hacerse según sus decisiones.

Ate los cabos sueltos, revise sus cajas de borde. Intenta romperlo. Explíquelo en todas las situaciones que pueda, comenzando con las más probables para su audiencia.

Ábrelo a un grupo más grande de personas que tú y tus amigos. Pídales comentarios, vea cómo lo rompen, verifique lo que pensó que sucedería con lo que realmente sucede para cualquier acción / dinámica / movimiento en el océano. Escucha. Chinches. Tome nota de las características más utilizadas y las características solicitadas comúnmente, y minimice las características olvidadas … o modifíquelas para que sean más útiles.

Una vez que esté seguro de que es increíble, la gente lo quiere, y lo usa, lo abre al uso público. Posiblemente comience a cobrar por él, o implemente alguna otra forma de monetización, o hágalo de código abierto y construya plataformas a su alrededor si tiene sentido. Tener un fantástico soporte y servicio al cliente.

Ahora siga probando, porque siempre hay una manera de mejorarlo. A medida que más personas lo usen, comenzará a tener que preocuparse mucho más por el equilibrio de carga, la alta disponibilidad y la entrega de contenido.

Pensará en más funciones o mejores formas de hacer las cosas. Obtendrá información que solo puede suceder después de meses de observar patrones de grupos más grandes de personas. Trate de encajar en lo que encaja, y si no encaja pero suena perfecto, agréguelo a la lista para la versión 2.0

Tome todo lo que ahora sabe y comience nuevamente desde el principio con la versión 2.0

TLDR: cree con su audiencia en mente, pregúnteles constantemente qué lo mejoraría (tanto directa como figuradamente), optimice para siempre.

Definitivamente más útil que mi diatriba nocturna:

Libros:
HTML y CSS
JavaScript y jQuery
No me hagas pensar: un enfoque de sentido común para la usabilidad web
Diseño para software: un libro de jugadas para desarrolladores
Estrategia de contenido para la web

Artículos:
Ensayos de Paul Graham
Señal contra ruido
http://zachholman.com/

Mis herramientas favoritas para asociarme en un proyecto web:

Slack: excelente comunicación de equipo e intercambio de archivos, toneladas de capacidad de integración (nivel gratuito)

waffle.io: una placa de estilo kanban / ágil para administrar tareas, se sincroniza con problemas de github (gratis)

Github: copia de seguridad de código, control de versiones (a través de git), colaboración / gestión de sucursales, seguimiento de hitos / progreso, seguimiento de tareas (con waffle = fantástico), visualización del flujo de trabajo, despliegue de ganchos, en serio, si nunca ha usado esto, es increíble. (gratis para repositorios públicos. Obtenga una cuenta organizacional si trabaja con un equipo).

CodePen: creación rápida y perfecta de prototipos html / css / js. Excelente para probar / dibujar ideas rápidamente. También cuenta con programación / colaboración remota de pares, modos de demostración y presentación, y un montón de código inspirador de otras personas en todo el mundo. (nivel libre)

No te preocupes!
¡Cada experto fue un principiante una vez!

Aquí hay algunos puntos … que deberían cubrirse al menos (desde mi punto de vista):

  • Divide y vencerás: divide tu trabajo en partes y distribúyelo en partes para que puedas manejar las cosas al mismo tiempo con un desarrollo más rápido.
  • Si es posible, use jsfiddle o codepan para desarrollar. Es demasiado rápido cuando todo está en la misma pantalla.
  • Tener objetivos para completar tareas con límites de tiempo.
  • Use Github para el control de versiones. (La GUI de Github es demasiado fácil de usar).
  • SEO : Para cada proyecto de desarrollo web, esto es imprescindible. Recomiendo ir a un curso pago (si puede pagarlo) por Udemy o Lynda.com que puede enseñarle estas cosas en muy poco tiempo.

Espero que esto ayude.
(:

Cada aplicación tiene un propósito. La clave del diseño y desarrollo es descubrir cuál es el propósito, asegurarse de que todos en el equipo lo entiendan y nunca perder su enfoque en ese objetivo.

Tendrá que tomar muchas decisiones. ¿Qué tipo de pila? qué idiomas, qué marcos, qué base de datos, sincronización o asíncrono. La mayoría de estas opciones están enraizadas en el incontable “cuántos usuarios”; si construyes por 100k pero solo obtienes 100, has quemado mucho tiempo y dinero sobre ingeniería. Si obtienes 100k pero solo planeaste para 100, bueno, primero felicitaciones y segundo … tienes algunos latidos para convertir tu carrito de burro en un Ferrari. Cada minuto que su sitio se arrastra se reduce el costo de oportunidad de los ingresos publicitarios y la pérdida de usuarios.

Hasta donde sé, no hay un libro para el estado del arte porque es un objetivo que se mueve rápidamente. Los libros son demasiado lentos. Así que recomendaré un libro viejo. Un libro de dinosaurios. Phillip Greenspun “Sitios web respaldados por bases de datos”. Hay un par de ediciones y su nueva Ingeniería de Software para Aplicaciones de Internet está disponible gratuitamente en línea y es un libro de texto para un curso MIT.

En mi opinión, el punto de partida más importante es aprender a configurar el backend para hacer lo que quieras. Eso significa hacer diagramas de ER para descubrir cómo se modelará todo lo que desea que haga su aplicación.

Una vez que tenga eso en su lugar, estará mucho mejor cuando llegue a crear una instancia.

Para instanciarlo, recomendaría usar un marco MVC. Han existido por un tiempo porque generalmente tienen sentido. Mantiene su código más aislado al tener un modelo que se ocupa de obtener los datos que desea, una vista que muestra las cosas como desea y un controlador que se comunica entre los dos. Los diferentes marcos de aplicación determinarán exactamente cuánto se debe permitir que haga la vista o qué transformación es razonable tener en el nivel del modelo, pero esa es la respuesta general.

Para marcos MVC específicos, soy parcial a Django porque amo Python en un grado poco saludable. Pero Ruby on Rails, Web2Py y muchos otros también son perfectamente razonables.

Primero, y lo más importante: debe moldear su idea hasta los huesos más básicos de lo que debe ser. Esto se llama MVP (producto mínimo viable).

Luego ponga su idea en papel, haga un bosquejo de cómo imagina que funciona la interfaz, de nuevo manténgala súper simple …

Como ejemplo, supongamos que desea crear una aplicación de creación de documentos basada en la nube donde el objetivo final sea poder crear y guardar documentos en un servidor. Apunte exactamente eso antes de pensar en agregar algo más.

En segundo lugar, aprende a programar.

No solo en un marco, aprenda el lenguaje base en sí mismo (no aprenda angular o node.js, aprenda JavaScript y luego aprenda a usar angular o node.js)

Pruebe algunos tutoriales y libros, o un curso (teamtreehouse.com hace algunos excelentes). No tenga miedo de gastar unos pocos libras, vale la pena invertir en habilidades que lo ayudarán en el futuro.

¡Finalmente, comience!

Cree su MVP simple y comente su código tanto como sea necesario … en algún momento un desarrollador podría terminar necesitando saber cómo o por qué ha hecho las cosas de cierta manera, ¡o puede que necesite dirección usted mismo!

Espero que esto ayude, ¡buena suerte con tu proyecto!

Pues no puedes. Lamento decir esto, pero no puedes hacer nada grandioso sin experiencia y fallas.

La mejor manera de garantizar una buena web es dibujar su diseño en papel y escribir notas y fragmentos antes incluso de codificarlos. Cuando codificamos nos preocupamos demasiado por escribir y sintaxis, es difícil captar una imagen más grande. Solía ​​golpear el techo con mi base de código durante varias semanas, y después de solo una noche escribiéndolo en papel, resolví todo a la mañana siguiente.

Entonces aprende de buenos ejemplos. Vaya a la aplicación web que le gusta y siga haciendo clic y tomando notas de por qué le gusta. Incorpora eso a tu diseño. UX es un tema complejo, pero se reduce a la facilidad de uso.

Elija la pila y los marcos que se adapten a su diseño. es decir, si desea una aplicación de una sola página, entonces puede buscar en js frameworks como Ember o Backbone. Este es un tema diferente.

A2A

Supongo que no está escribiendo código usted mismo, sino que está permitiendo que otros 4 estudiantes hagan el trabajo por usted.
Mi consejo:

  1. Descubra el interés de su equipo en áreas de front-end y backend
  2. dividirlos en un grupo de 2 cada uno (2 front-end, 2 backend)
  3. Dígales las tecnologías que necesita para construir este proyecto.
  4. Comprar arquitectura de aplicaciones web: principios, protocolos y prácticas: Leon Shklar, Rich Rosen: 9780470518601: Amazon.com: libros, lea y deje que los miembros de su equipo lean sobre esto
  5. Tareas – Páginas básicas -> Llamadas API -> definir contrato JSON y dejar que el equipo de front-end se burle de JSON y construir front-end contra él, mientras que el equipo de backend descubra las formas de producir los datos

Así es como lo haría.

PD: suposiciones que hice. los miembros del equipo saben programar

Esto es lo que hice. Me funcionó cuando estaba en una situación similar. Seguir esto en lugar de una solución de Microsoft lo dejará todos los días con un conocimiento y comprensión reales de cómo funciona la web.

1. Ruby on Rails. La curva de aprendizaje es un poco más empinada de lo que a la gente le gusta creer, pero vale la pena subirla.

2. Mysql BD. Hasta que realmente sepas mejor, usa mysql.

3. HTML 5. Elija una plantilla gratuita que le guste y comience desde allí. Sé ambicioso, elige algo genial.

4. CSS Es un verdadero dolor. No he encontrado una forma de evitarlo. No dejes que te rompa.

5. JavaScript. Puedes convencer al mundo con javascript. Desata su poder

6. Usa git.

Un consejo de diseño: no permita que las páginas tarden en cargarse. Solo lo odio. Si una página necesita datos, almacénelos. Si no puede, cargue la página y coloque el reloj de arena sobre el div de carga lenta.

Tomará horas y días. Sé fuerte.

Hay dos conceptos básicos que puede adquirir rápidamente. El primero se llama “desarrollo ágil” (desarrollo de software ágil) y el segundo es “desarrollo basado en pruebas” (desarrollo basado en pruebas). Agile enseña que comienzas pequeño y agregas complejidad; i., e., comience con la característica fundamental más simple, impleméntela y asegúrese de que funcione. TDD dice que nunca agregue código a menos que tenga un caso de prueba para ese cambio.

Yo miraría a SCRUM. SCRUM es una forma de hacer un progreso constante en un proyecto y realizar un seguimiento del progreso. Usted dice lo que debe lograrse durante el mes (nota: involucre a su equipo en el establecimiento de sus metas. Puede estar pidiendo demasiado, y le dirán por adelantado si es factible o no).

No puedes

Debe aprender a crear aplicaciones web antes de crear una aplicación web excelente.

No hay atajos.

Pero puedes comenzar a aprender. Pruebe el libro de Hartl sobre RoR, se llama Rails Tutorial. Es gratis.

Lo siento.

Eso, o pagas miles y miles de dólares.

En junio de 2014 comencé a aprender Ruby on Rails. Tenía absolutamente 0 experiencia previa. Mi título es en biología del ejercicio. A finales de agosto había creado una aplicación web para consejos de fútbol de fantasía de cowdsourcing. Todavía hay mucho trabajo por hacer, pero no está mal por solo 2.5 meses, ¿verdad?

Comencé con el libro de Mike Hartl: Tutorial de Ruby on Rails.

Luego comencé a usar CodeJinn cada vez que me encontraba con problemas.

También recomiendo leer The Lean Startup.

Lo más importante es mantenerlo todos los días. Obtuve un calendario de un año y lo puse al lado de mi escritorio. Cada día que codificaba, ponía una gran X roja. El objetivo es poner en marcha una racha y nunca romperla. Mantén la racha sin importar cuán ocupado o cansado estés. Jerry Seinfeld usó esta técnica para escribir chistes.

Solo ponte a trabajar. Deja de planificar y comienza a hacerlo.

More Interesting

¿Existe un calendario web colaborativo para la planificación a largo plazo?

Cuántas mejoras e iteraciones importantes pasan las aplicaciones web exitosas antes (y si) se vuelven exitosas; ¿Y qué mejoras fueron?

Cómo garantizar el desarrollo exitoso de la aplicación de Android y la aplicación web mediante la contratación externa a autónomos

¿Qué pasó con Omnisio después de su adquisición por parte de Google?

¿Debo aprender Flask o Django? Soy un principiante y estoy buscando simplicidad y facilidad de aprendizaje.

¿Cuál es el mejor programa editor de texto para fines de desarrollo web?

¿Cuáles son las mejores herramientas / marcos para un desarrollador de back-end para construir rápidamente una interfaz de usuario web?

¿Cuál es el mejor software de programación de empleados en línea en el Reino Unido?

¿Cuáles son las mejores aplicaciones web de servicio público / gubernamental?

¿Por dónde empiezo con el desarrollo de una aplicación de lista de tareas colaborativa? ¿La base de datos NoSQL y Node.js son adecuados para esto?

¿Por qué no se han quitado los libros de texto basados ​​en navegador?

Parece que Spring 5 se está alejando de la aplicación web convencional, ya que sus tutoriales para aplicaciones web siguen usando Spring Boot. ¿Por qué?

¿Cuál es la mejor manera de desarrollar una aplicación web Java para crear formularios dinámicos y recuperarlos de una base de datos?

¿Cuáles son algunas herramientas muy innovadoras para administrar el flujo de trabajo personal?

¿Cuál es el mejor lenguaje para crear una aplicación web que monitorea los datos de la base de datos?