1. Con una cuenta podrás:

    • Publicar preguntas y pedir ayuda
    • Crear tutoriales
    • Acceder a contenido privado
    • Convertirte en un Héroe de la web
    Cerrar notificación
  2. Eres nuevo en la comunidad y necesitas ayuda?
    Sigue estos pasos y recomendaciones antes de publicar tu duda:
    Cerrar notificación

Tutorial Crear tu web desde 0

Tema en 'Tutoriales de PHP' comenzado por roger, 22 de Enero de 2015.

  1. roger

    roger Miembro

    Se incorporó:
    22 de Enero de 2015
    Mensajes:
    32
    Me gusta recibidos:
    8
    Puntos de trofeos:
    8
    Género:
    Hombre
    Hola amigos primero de todo esto lo hago por que me he dado cuenta que hay mucha gente que quiere enseñarse a programar y no hay muchos tutoriales primero de todo en este tutorial vamos a crear una web osea que vamos a usar muchos diferentes lenguajes de programación PHP , CSS3 HTML5


    Parte 1 instalación y montaje de la estructura

    Empezamos primero de todos vamos a instalar un programa para crear un localhost para poder trabajar mejor podemos usar unos de los siguientes (Xampp appserver Mamp) yo usare el Mamp una vez descargamos vamos a proceder a crear las estructura de la web (Importante)

    [​IMG]
    Creamos las carpetas y el index

    ahora nos vamos a abrir el index.php

    Código (Text):
    <?php
    //definimos la ruta adonde están todos los archivos
    define('pagina','./');
    //cargamos el archivo head.php
    include "paginas/head.php";
    //cargamos el archivo navegacion.php
    include "paginas/nav.php";

    //detectamos la url
    if (!isset($_GET['page']))
    {
    //localhost/index.php cargara este archivo si no el otro
        include(pagina."paginas/default.php");
    }
    else
    {
      //localhost/index.php?page=loquequerais
        include(pagina."paginas/".$_GET['page'].".php");
    //esto lo que hace es todo lo que este despues del = de paginas lo pasara a php osea por ejemplo  loquequerais.php

    //ejemplo    include(pagina."paginas/loquequerais .php");

    }
    //cargamos el archivo footer
    include "paginas/footer.php";
    ?>
     

    Bien una vez tenemos este archivo y sabemos como funciona lo que vamos a crear los otros archivos

    En primer archivo que vamos a crear es head.php nos vamos a paginas y lo creamos

    dentro de ese archivos creamos lo siguiente
    Código (Text):
    <!DOCTYPE html>
    <html lang="es">

    <head>

       <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
        <title>Roger</title>
       <link href="css/bootstrap.min.css" rel="stylesheet">
        <link href="css/general.css" rel="stylesheet">

    </head>
    Explicación

    <meta charset="utf-8"> esto se encarga que la pagina web detecte los acentos y los caracteres especiales como =?¿)(/%*

    <meta name="viewport"> eso se encarga que cuando entre un cliente a la web desde un dispositivo movil no puedo hacer el efecto lupa

    <link href=""> esto carga los archivos css en nuestro caso vamos a crear esos dos los guardamos en la carpeta de css

    Bien ahora que ya tenemos creado esto vamos a crear el menu para ello vamos a usar una librería que es la de
    bootstrap y no la descargamos y copiamos el archivo que se llama bootstrap.min.css y lo pegamos en nuestro proyecto en el siguiente directorio css/bootstrap.min.css

    Una vez creado todo eso procedemos al código

    Código (Text):
    <div id="contenido_general">
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">Start Bootstrap</a>
                </div>
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <li>
                            <a href="#">About</a>
                        </li>
                        <li>
                            <a href="#">Services</a>
                        </li>
                        <li>
                            <a href="#">Contact</a>
                        </li>
                    </ul>
                </div>
            </div>
    </nav>

    Y pegamos eso creo que no hace salta una explicación es ese código

    Una vez tenemos todo lo de detrás creado lo que vamos a hacer es empezar a programar para eso tenemos que empezar por el archivo defaut ya que es el archivo principal en ese archivo vamos a meter un codigo simple

    Código (Text):
    <?php


    echo "PAGINA POR DEFECTO";
    ?>
     

    Una vez guardado vamos a tener una web con un menu y una parte de centro y una footer no creado en el próximo capitulo crearemos el diseño para la web totalmente modular y adaptable desde todos los dispositivos móviles



    Notas: Ya se que este es el apartado de php y no he puesto casi pero mas adelante sera todo puro php de momento es todo por hoy buenas noches gente
     
    Última modificación: 23 de Enero de 2015
    A FalconMasters y Maddenamy les gusta esto.
  2. FalconMasters

    FalconMasters
    Administrador
    Miembro del Equipo

    Se incorporó:
    6 de Enero de 2015
    Mensajes:
    392
    Me gusta recibidos:
    315
    Puntos de trofeos:
    63
    Género:
    Hombre
    Ocupación:
    Diseñador Web
    Página web:
    Bien el tutorial, aunque me parece que tienes un error, en las capetas pusiste paginas y en el código pusiste pages
     
  3. roger

    roger Miembro

    Se incorporó:
    22 de Enero de 2015
    Mensajes:
    32
    Me gusta recibidos:
    8
    Puntos de trofeos:
    8
    Género:
    Hombre
    No me di cuenta de ese fallo ya a sido editado esta tarde subiré la segunda parte
     
  4. AyuukJaay

    AyuukJaay Miembro Activo

    Se incorporó:
    8 de Enero de 2015
    Mensajes:
    149
    Me gusta recibidos:
    69
    Puntos de trofeos:
    28
    Género:
    Hombre
    Página web:
    Tengo una duda, es buena practica que PHP Sirva los archivos HTML ? no sera mejor que lo haga apache y PHP se use para API Rest ?
     
  5. roger

    roger Miembro

    Se incorporó:
    22 de Enero de 2015
    Mensajes:
    32
    Me gusta recibidos:
    8
    Puntos de trofeos:
    8
    Género:
    Hombre
    No te puedo responder a la pregunta por que no se que es el Api rest

    Sobre lo otro tu en un archivo con extensión php si dentro de ese archivo tu crear las prantilla basica del lenguaje no tienes por que darte ninguno problema

    ejemplos

    yo tengo un archivo que se llama hola.php

    y dentro de ese archivo pongo lo siguiente


    Código (Text):
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Documento sin título</title>
    </head>

    <body>
    </body>
    </html>
     
    El navegador al cargar el archivo lee lo siguiente

    <!doctype html> y el ya sabe que es html aunque la extensión este em php lo de la extensión en php se usa por que es mas seguro y para incorporar en un html algunas funciones del php nose si te he liado mas pero yo creo que es de esta forma no me hagas mucho caso ya que todo esto me he enseñando investigando en el código
     
  6. AyuukJaay

    AyuukJaay Miembro Activo

    Se incorporó:
    8 de Enero de 2015
    Mensajes:
    149
    Me gusta recibidos:
    69
    Puntos de trofeos:
    28
    Género:
    Hombre
    Página web:
    Si te entiendo muy bien, alguna vez programe de esa manera, pero creo que hay que tener bien claro que html es front-end y php es back-end y mezclar ambos seria una manera sucia de programar, actualmente hago uso de plantillas en el lado del front-end como jade, mustache, handlebars, etc.. y es lo mismo pero ya no mezclas php con html, y php lo unico que hace es responder a las solicitudes del front pero ya no metes html dentro de php. no se si esta forma es correcta o que tanto recomiendas tu programar de la manera que lo estas haciendo ?
     
  7. roger

    roger Miembro

    Se incorporó:
    22 de Enero de 2015
    Mensajes:
    32
    Me gusta recibidos:
    8
    Puntos de trofeos:
    8
    Género:
    Hombre
    todos mis profesores lo hacen de esta forma no se si sera correcto del todo buscare a alguien que sepa y que nos diga haber
     
    A AyuukJaay le gusta esto.
  8. DarioNahuel

    DarioNahuel Nuevo Miembro

    Se incorporó:
    9 de Enero de 2015
    Mensajes:
    8
    Me gusta recibidos:
    13
    Puntos de trofeos:
    3
    Género:
    Hombre
    Es que en todos lados te dicen que no tienen que mezclar codigo php con html, muchos usan un intermediario, motores de plantillas, como el clasico smarty, laravel usa blade, phalcon volt para manejar el codigo php de manera mas prolija en la vista. Como backend a mi me combiene hacer todo como api rest y que el front luego se encargue, me quita responsabilidad, pero bueno se sigue trabajando de las dos formas actualmente. Por algo solicitan demasiado que el php developer pueda trabajar tanto de front como de back

    El ejemplo de el esta bien hecho para mi orientado sitios pequeños que necesitan cosas basicas nada mas. No te vas a poner a montar un entorno de desarrollo gigante para un par de funcionalidades.
     
    Última modificación: 26 de Enero de 2015

Comparte esta página