1
resposta

jQuery - Alura Typer

Quando acesso o servidor Alura Typer (http://localhost:3000/principal.html) conforme instruções, estou tendo os seguintes erros:

Alura Typer
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

description 19 palavras
query_builder 10 segundos
restore assignment shuffle
0 caracteres
0 palavras
Placar
Usuário    Qtd de palavras
Usuario Exemplo    99

Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/css/libs/materialize.min.css
principal.html:7 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/css/libs/google-fonts.css
principal.html:8 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/css/estilos.css
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/js/jquery.js
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/js/materialize.min.js
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/js/main.js
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/js/placar.js
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/js/frase.js
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/css/libs/materialize.min.css
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/css/libs/google-fonts.css
principal.html:1 Not allowed to load local resource: file:///C:/Users/Silvestre/Desktop/JQ/public/css/estilos.css

O "principal.html" está assim:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Alura Typer</title>
    <link rel="stylesheet" href="C:\Users\Silvestre\Desktop\JQ\public\css/libs/materialize.min.css">
    <link rel="stylesheet" href="C:\Users\Silvestre\Desktop\JQ\public\css/libs/google-fonts.css">
    <link rel="stylesheet" href="C:\Users\Silvestre\Desktop\JQ\public\css/estilos.css">
</head>
<body>
    <div class="container">
        <h1 class="center">Alura Typer</h1>
        <p class="frase center">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>

        <ul class="informacoes center">
            <li>
            <i class="small material-icons icones">description</i>
            <span id="tamanho-frase">19</span> palavras
            </li>
            <li>
            <i class="small material-icons icones">query_builder</i>
            <span id="tempo-digitacao">10</span> segundos
            </li>
        </ul>

        <textarea class="campo-digitacao" rows="8" cols="40"></textarea>

        <div class="botoes">
            <a id="botao-reiniciar" class="btn-floating btn-large waves-effect waves-light red">
                <i class="material-icons">restore</i>
            </a>

            <a id="botao-placar" class="btn-floating btn-large waves-effect waves-light green">
                <i class="material-icons">assignment</i>
            </a>

            <a id="botao-frase" class="btn-floating btn-large waves-effect waves-light blue">
                <i class="material-icons">shuffle</i>
            </a>

        </div>

        <ul class="center">
            <li><span id="contador-caracteres">0</span> caracteres</li>
            <li><span id="contador-palavras">0</span> palavras</li>
        </ul>

        <section class="placar">
            <h3 class="center">Placar</h3>
                <table class="centered bordered">
                    <thead>
                        <tr>
                            <th>Usuário</th>
                            <th>Qtd de palavras</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Usuario Exemplo</td>
                            <td>99</td>
                        </tr>
                    </tbody>
                  </table>
        </section>

    </div>


    <script src="C:\Users\Silvestre\Desktop\JQ\public\js/jquery.js"></script>
    <script src="C:\Users\Silvestre\Desktop\JQ\public\js/materialize.min.js"></script>
    <script src="C:\Users\Silvestre\Desktop\JQ\public\js/main.js"></script>
    <script src="C:\Users\Silvestre\Desktop\JQ\public\js/placar.js"></script>
    <script src="C:\Users\Silvestre\Desktop\JQ\public\js/frase.js"></script>


</body>

</html>
1 resposta

Fala ai Silvestre, tudo bem? Tente mudar as importações dos arquivos (assets) para utilizar caminho relativo ao invés do absoluto, por exemplo:

// absoluto
<script src="C:\Users\Silvestre\Desktop\JQ\public\js/jquery.js"></script>

// relativo
<script src="./js/jquery.js"></script>

Espero ter ajudado.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software