Hoje falaremos sobre um tipo de sistema muito utilizado no dia a dia. O Sistema de Notícias.
Dificilmente você encontra matérias na Internet contendo um passo a passo completo e explicativo. Tem sim: vários sistemas disponíveis com código pronto para você apenas copiar.
Nesta matéria comentaremos as partes mais importantes de cada script, visando facilitar seu aprendizado.
Passo 1: Estrutura de pastas
Como alguns já sabem, gosto de focar os sistemas que desenvolvo de forma limpa, prática e organizada.
Por este motivo, apresentamos abaixo a estrutura utilizada nas pastas deste Sistema:
OBS.: Na pasta
Passo 2: Criando as Tabelas na Base de Dados:
Antes de partirmos para a programação, abra o arquivo script-sql.txt (disponível no arquivo em anexo) e cole seu conteúdo no Programa utilizado para gerenciamento da base de dados.
Em nossas matérias utilizamos como padrão o MySQLFront. Caso você queira utilizar este programa, clique em SQL Editor e cole o conteúdo do script (conforme imagem abaixo).
Passo 3: Script De Conexão
Tendo as pastas já criadas e as tabelas na base de dados geradas, você já pode dar início à Programação!
Crie o arquivo conexao.php e coloque dentro da pasta CONFIG.
Neste arquivo, você deverá disponibilizar o texto abaixo:
----- CONFIG.PHP ------
$database="localhost:3307"; // SERVIDOR E PORTA UTILIZADA
$dbname="tutorial"; // BASE DE DADOS
$usuario="root"; // USUÁRIO DO MYSQL
$dbsenha=""; // SENHA DO MYSQL
$conexao=mysql_connect ($database, $usuario, $dbsenha);
if($conexao){
if (mysql_select_db($dbname, $conexao)){ print "";
}else{ print "Não foi possível selecionar o Banco de Dados"; }
}else{ print "Erro ao conectar o MySQL"; }
?>
----------
Passo 4: Menu Gerencial – Formulário (index.php):
A página index.php apesar de ter uma aparência simples, é de fundamental importância para este sistema.
Através dela temos acesso ao menu gerencial!
OBS.: Para facilitar seus acessos, criamos o usuário abaixo:
Login: teste@teste.com – Senha: 123456
Passo 5: Menu Gerencial – Autenticação (autenticacao.rotinas.php):
Esta será a página onde faremos todo o gerenciamento de usuários, isto é: Diremos ao Sistema quem deve ou não ter acesso à Área Gerencial.
Bem… estamos disponibilizando um script simples de acesso, porém, caso seja de seu interesse, você poderá melhorar este código.
-----Linha 02 e 03 -----
session_start();
include ("../config/conexao.php");
------------
Talvez esta seja a parte mais importante do código, pois se você não tiver este conteúdo em seu código, ele simplesmente não vai registrar a sessão, nem permitir a conexão à base de dados.
-----Linha 06 à Linha 08 -----
$cliente_username = $_POST["usuario"];
$cliente_password = $_POST["senha"];
$enviado = $_POST["enviado"];
---------------
Através das linhas acima você receberá as variáveis com o nome do usuário, senha de acesso e o status (neste caso, utilizaremos a condição enviado para reforçar na segurança).
-----Linha 10 à Linha 29 -----
if ($enviado == "posted"){
if (!isset($cliente_username) or !isset($cliente_password)) { echo "Erro!"; exit; }
if (empty($cliente_username) or empty($cliente_password)) { echo "Dados inválidos!"; exit; }
$query = "select * from tbl_usuarios where email = '$cliente_username' and senha = '$cliente_password'";
$result = mysql_query($query);
$number = mysql_num_rows($result);
if ($number==0) { ?>
exit;
} else {
$_SESSION['usuario_id'] = mysql_result($result,0,'id');
$_SESSION['usuario_nome'] = mysql_result($result,0,'nome');
?>
}
mysql_close($conexao);
}
----------
Nas linhas acima o script fará uma validação completa, verificando se o usuário e a senha informado existem.
Antes disso, ele só fará a leitura se a variável $enviado (exemplo da linha 6 à linha 8) tiver o valor posted.
Caso este valor (que será passado através do método POST) não seja o informado, ele sequer fará a leitura no demais.
Nas linhas a seguir (após ele validar a variável $enviado) o script fará uma série de verificações, finalizando ao registrar as sessões para o ID e NOME do Usuário selecionado. Além disso ele fará seu direcionamento à página principal.php.
Passo 6: Menu Gerencial – Página Principal (principal.php):
Esta será a página principal do sistema, onde teremos acesso às demais a serem gerenciadas (conforme você pode ver na imagem abaixo).
OBS.: Apesar de também estar disponível no Sistema (no arquivo em anexo), para não tomar muito seu tempo, falaremos nesta matéria apenas dos itens Cadastrar Notícia e Listar Notícias.
Certamente os comentários diversos disponíveis nesta matéria sanarão qualquer dúvida que você tenha quanto aos demais arquivos.
-----Linha 02 à Linha 11 -----
session_start();
if (empty($_SESSION['usuario_id'])){
echo "Acesso negado!";
exit;
}else{
include('config/conexao.php');
$usuario_id = $_SESSION['usuario_id'];
$usuario_nome = $_SESSION['usuario_nome'];
}
------------
Neste trecho do script faremos uma validação!
Se o ID e NOME do usuário tiver em uso nsta sessão, ele deverá lhe dar acesso, caso não esteja em uso ele deverá restringir o acesso.
Fará acesso também ao script conexao.php (responsável pela conexão ao banco de dados).
Após isto, o sistema fará algumas verificações simples neste script, só atentando para o botão excluir (onde ele deverá direcionar seu acesso ao script logout.php (responsável pela exclusão da sessão).
Passo 7: Menu Gerencial – Cadastrar Notícia (noticias_cadastrar.php):
Esta é a página responsável pelo cadastro da notícia (conforme você pode ver na imagem disponível abaixo).
-----Linha 28 à Linha 35 -----
----------
O trecho acima chama os scripts responsáveis pelo funcionamento do Editor de Textos.
OBS.: Veja que ele chama os scripts a seguir: javascript.js, htmlarea.js, jscript.js e a pasta htmlarea.
-----Linha 46 -----
169 Responses
Olá, adaptei o frontend para minha necessidade e funcionou legal. Obrigado por compartilhar o conhecimento.
Cara, eu submeti os dados no site e funcionou legal.
Muitíssimo obrigado!
Me envie seu dados para que eu possa mencionar os direito do autor.
Att,
Gabriel Augusto
Olá,
Consegui fazer o sistema funcionar 100%, porém queria realizar apenas uma alteração, As noticias estão em modo decrescente ex: 1° noticia postada ontem 01/01/2016, a noticia abaixo é a mais recente sendo postada dia 02/01/2016, É possível deixar ao contrário?
colocando a mensagem mais recente por Primeiro(1°) ? Obrigado.