CursosEmpresasBlogLiveConfPrecios

Creación de Templates y Secciones en JavaScript

Clase 6 de 16 • Curso de Single Page Application con JavaScript Vanilla

Clase anteriorSiguiente clase
Resumen

Debemos crear una carpeta llamada Templates donde estarán los templates que se van a repetir en nuestra página.

const Header = () => {
    const view = `
    
    <div class="Header-main">
        <div class="Header-logo">
            <h1>
                <a href="/">
                    100tifi.co
                </a>
            </h1>
        </div>

        <div class="Header-nav">
            <a href="#/about/">
            </a>
        </div>
    </div>
    `
    return view;
}

export default Header;

Crea un nuevo archivo en el código

Luego nos movemos la carpeta page y creamos el archivo Character.js

const Character = () => {
    const view = `
    
    <div class="Character-inner">
        <article class="Characters-card">
            <img src="image" alt="name">
        </article>
        <h2>Name</h2>

        <article class="Character-card">
            <h3>Episode:</h3>
            <h3>Status:</h3>
            <h3>Species:</h3>
            <h3>Gender:</h3>
            <h3>Origin:</h3>
            <h3>Last Location:</h3>

        </article>

    </div>
    
    `
    return view;
}

export default Character;

Contribución creada con los aportes de: Jesus Federico David Herrera.