Tal vez te has preguntado y has buscado ¿Cómo puedes hacer una página web? Y te has encontrado con tutoriales que te han dado vueltas y vueltas y no vez el final, espero no ser uno mas del montón, aquí te dejo una serie de vídeos para que en un día puedas hacer una página web profesional con un buen diseño, el que mas te recomiendo es ¿Cómo hacer una página web con Bootstrap? ya que es el primero que subí. Y si te gusta mi página y quieres ayudarme, por favor dale compartir y suscríbete a al canal de YouTube EWebik.
Tabla de contenido
📌 Suscríbete a mi canal y activa la campanita para que no te pierdas ningún video 🤘
Si ya tienes conocimientos básicos o eres un desarrollador avanzado, puedes saltarte esta introducción de conceptos y ver los vídeos directamente, aunque no pierdes nada con repasar un poco la teoría.
Podemos definir a una página web como un archivo o documento electrónico que puede contener texto o contenido multimedia como vídeo, sonido, imagenes, etc., y puedes acceder a ella mediante un navegador web. Está hecha comúnmente sobre un lenguaje de marcado conocido como HTML o XHTML, y le damos una vista agradable a través de hojas de estilos conocidas como CSS.
Un sitio web es un conjunto de páginas web que están organizadas a través de URL's y que siguen una estructura que ayuda a los usuarios a navegar entre ellas.
Quizá aun no te ha quedado claro la diferencia entre una página web y un sitio web, no es tan complicado como parece, se puede decir que una página web es donde estas en este momento, accediste a través de la url "https://ewebik.com/pagina-web", la cual forma parte del sitio web ewebik.com, si ahora tu vas al navegador y escribes en el buscador site:ewebik.com, el buscador te regresará todas las páginas web que conforman el sitio web. En resumen
Un sitio web es la agrupación de una o mas páginas web.
Podemos clasificar a una página web por su funcionamiento ya que podemos encontrar páginas web estáticas y paginas web dinámicas, y ¿Qué significa esto?
Una página web estática es aquella que solo muestra su contenido que por lo regular es texto y no cuenta con funcionalidades que le permita al usuario interactuar con ella
Por ejemplo, un blog que solo es informativo, al cargar solo te muestra texto, quizá algunas imágenes y listo, la única acción que podrás hacer es dar clic en algún enlace para cambiar de página.
En resumen en una página web estática para realizar un cambio en su contenido, se requiere volver a cargar la página en sus totalidad.
Una página web dinámica es aquella página que carga su contenido y ademas cuenta con opciones para que los usuarios puedan interactuar con su contenido e incluso permite solicitar nuevo contenido sin la necesidad de recargar toda la página.
Una página web dinámica permite modificar ciertas partes de su contenido sin volver a recargar toda la página, esto se hace mediante tecnologías como AJAX. La cual solicita todo los cambios que los usuarios requieren al interactuar con la página y se comunica con el servidor donde esta alojada dicha página para descargar el nuevo contenido.
Bien ya conoces lo conceptos básicos que definen a una página web, ahora pasemos a temas un poco más técnicos, y separemos a una página web en 4 secciones para comenzar
Una página comúnmente se diseña por un lado la parte estética y por otro lado la lógica y se establecen los puntos de seguridad que debe cumplir, si ahora mismo que estas leyendo este artículo y no vez alguno de los 4 puntos anteriores, no te preocupes, por favor suscríbete a mi boletín o al canal de YouTube para que te avise de cualquier actualización y nuevo contenido.
Para desarrollar y desplegar un sitio web tendrás que rentar un espacio en Internet que se llama Hosting el cual tendrá instalado un servidor de aplicaciones web para que tu pagina pueda ser accedida a través de Internet. Te dejo estos post que son básicos y que te ayudarán a comprender mejor algunas definiciones.
Por el momento no tocare el tema de contratar un Hosting, dominio y mas, ya que empezaremos poco a poco y estamos en la etapa de aprender a desarrollar una página web, así que para comenzar te dejo el siguiente vídeo con el cual podrás levantar un servidor de aplicaciones web Apache en tu misma computadora y puedas practicar y realizar la mayoría de los ejemplos que estaremos viendo.
Con XAMPP podrás crear un servidor web en tu propia computadora y probar tus página web completamente gratis como si estuvieran publicadas en un Hosting en Internet, por favor mira el vídeo ya que es la base de los siguientes tutoriales.
El Frontend es la sección de una página web que se ejecuta del lado del cliente, es decir, es código que se ejecuta directamente en el navegador de los usuarios que visitan tu página y comúnmente es:
Todo lo que hagas en tu página y se ejecute del lado del usuario es información publica que todo el mundo podrá ver y analizar, por lo tanto, si tienes un proceso, tarea, información o datos sensibles de tu página, como la conexión a base de datos, jamás deberías agregarla del lado del Frontend.
Por ejemplo, en el siguiente vídeo aprenderás a realizar una página web estática con la intención de que comiences a familiarizarte con algunos lenguajes como HTML y CSS, y veas la creación de una página desde cero con una de las bibliotecas multiplataformas mas usadas en el mundo.
¿Estas buscando una página que se vea en todos los navegadores? Y no sabes como hacerla aquí tienes un tutorial con el cual podrás crear una página web responsive con Bootstrao desde cero que se visualice correctamente en cualquier dispositivo, y lo mas importante es que podrás acceder al código en nuestro repositorio de EWebik.
El Backend es la sección de tu página que se ejecuta del lado del servidor y solo tu y tus desarrolladores tienen acceso, esto quiere decir que el backend es la lógica que hace funcionar tu página y que da soporte al Frontend para que tus usuarios puedan interactuar y realizar acciones dentro de tu página web.
En el Backend es seguro tratar datos sensibles y puedes desarrollar algoritmos que no desees que sean publico, algunos ejemplos de lenguajes de programación para Backend son:
Y en el primer ejemplo que te dejo para crear una página web desde cero, utilizaremos Node JS para agregar esta lógica del lado del servidor y dar mas funcionalidades a nuestra página estática que desarrollamos anteriormente.
Si quieres dar el siguiente paso en tu estudio de programación web, no te puedes perder este magnifico vídeo donde aprenderás a crear una página web con Node JS desde cero, aprende a instalar NodeJs y ejecutar comandos con el gestor de paquetes NPM, no lo pienses mas y ve el vídeo y comparte.
Es otro lenguaje de Backend que te permite crear páginas dinámicas de una forma muy sencilla, por ejemplo en este curso que te dejo a continuación aprenderás todo sobre PHP y MySQL y al final podrás crear un dashboard con gráficas y todo te recomiendo que los veas.
No te desesperes si no encontraste mas tutoriales, por favor, ayúdame a compartir y suscríbete al boletín y al canal de YouTube para que pueda subir mas tutoriales como estos.
Electrónica y diseño web
Durante años he desarrollado plataformas dedicadas al rastreo satelital y varios sitios web que se encuentran en la primera página de Google, y hoy quiero compartir contigo lo que se en tecnologías como Node JS, PHP, C# y Bases de datos, si quieres apoyarme sígueme en mis redes sociales y suscríbete a mi canal de YouTube.
@Puedes seguirme en mis redes
📌 Suscríbete 🤘
