Olá Marcelo, tudo bem?
Então o "Marko" nada mais é que do que um template dinâmico de HTML, isso é organizamos nosso arquivo como se fosse um html normal, entretanto temos alguns bônus como poder passar dados para esse html, poder utilizar alguns recursos mais programáticos como ter recursos como tags for
, if
dentro de nosso próprio html.
Em relação a sua pergunta: O ideal seria utilizar o marko para conseguir passar as informações para o seu template, mas veja que podemos copiar um html e css para o marko que ele irá renderizar normalmente, então você não precisa refazer aquilo que você já tem :)
Observe uma parte de um dos formulários que será apresentado no curso, veja que é um html padrão um pouco mais inteligente com os recursos do marko:
<div class="container">
<h1>Cadastro de livros</h1>
<form action="/livros" method="post">
<div if(data.livro.id)>
<input type="hidden" name="_method" value="PUT">
<input type="hidden" name="id" value="${data.livro.id}">
</div>
<div class="form-group">
<label for="titulo">Titulo:</label>
<input type="text" id="titulo" name="titulo" value="${data.livro.titulo}" placeholder="coloque o titulo" class="form-control"/>
</div>
<div class="form-group">
<label for="preco">Preço:</label>
<input type="text" id="preco" name="preco" placeholder="150.25" value="${data.livro.preco}" class="form-control"/>
</div>
<div class="form-group">
<label for="descricao">Descrição:</label>
<textarea cols="20" rows="10" id="descricao" name="descricao" placeholder="fale sobre o livro" class="form-control">${data.livro.descricao}</textarea>
</div>
<input type="submit" value="Salvar" class="btn btn-primary"/>
</form>
</div>
Não temos como passar informações para um arquivo html pois ele é estático, então precisamos de bibliotecas como o marko para poder renderizar nosso frontend com as informações que temos no banco de dados, ou que vieram da requisição do usuário para ter algo mais dinâmico :)
Conseguiu compreender?
Abraços e bons estudos!