INCLUSÃO DEFINITIVA DAS INFORMAÇÕES APÓS F5

Baseado nos módulos do curso eu consegui desenvolver um site de consulta de medicamentos para utilizar na minha empresa e acredito que ficou bem alinhado. Todas as funções apresentadas no curso foram replicadas com sucesso como por exemplo inclusão de novas informações e o filtro seletivo.

Contudo, quando eu faço a inclusão de novos medicamentos na tabela e der um F5 os novos dados não ficam gravados (Cria-se a tr com as td mas depois de atualizar o site elas somem. Como eu posso corrigir isso para fazer com que as novas informações adicionadas possam permanecer na tela?

Eu fiz o módulo 4 Eventos, Formulários e Criando Elementos várias vezes e não vi ou passou despercebido essa função. Alguém pode me ajudar?

Outra dúvida, agora eu quero disponibilizar o acesso a esse site a todos os outros vendedores da minha empresa. Qual curso eu aprendo a fazer isso?

Obrigado,

var marcas = document.querySelectorAll(".marca");
console.log(marcas);

//array 
for( var i = 0; i < marcas.length; i++){
    console.log(marcas[i]);
}

//esucta o click do botaoAdicionar pela id e recarrega a pagina
var botaoAdicionar = document.querySelector("#adicionar-medicamento");
botaoAdicionar.addEventListener("click", function(){
event.preventDefault();

//trazer o form do mundo html para js
//selecionei o form com os inputs dele
//acesso as variáveis do input pelo name
var form = document.querySelector("#form-adiciona");

var marca = obtemPacienteDoFormulario(form)

var marcaTr = montaTr(marca);


//vou criar uma marca que é uma tr passando o nome da tag
//criou a variável tabela para incluir a tr criada anteriormente e add paciente na tabela
var tabela = document.querySelector("#tabela-marca");
tabela.appendChild(marcaTr);
form.reset();
});


//medicamento, linha e repcontato são itens comuns ao objeto marca (propriedades do objeto), busco do form pelo name e value.
function obtemPacienteDoFormulario(form){

    var marca = {

        medicamento: form.medicamento.value, 
        linha: form.linha.value,
        repcontato: form.repcontato.value

    }

    return marca 

}

function montaTr(marca){
    var marcaTr = document.createElement("tr");
    marcaTr.classList.add("marca");

    marcaTr.appendChild(montaTd(marca.medicamento, "info-nomedamarca"));
    marcaTr.appendChild(montaTd(marca.linha, "info-nomedalinha"));
    marcaTr.appendChild(montaTd(marca.repcontato, "info-repcontato"));

    return marcaTr
}

function montaTd(dado, classe){
var td = document.createElement("td");
td.textContent = dado;
td.classList.add(classe)

return td;
}