【PHP】Twitterみたいなつぶやき投稿アプリを作るためのソースコード(つぶやき画面)

この記事は約5分で読めます。
ポートフォリオ制作実績

Twitterみたいなつぶやき投稿アプリを簡単に作ってみましょう。
文系未経験でも簡単に作れるようにソースコードを掲載しました。

本記事で必要になる画面は下記に記しております。

・ログイン画面(login.php)
・ログアウト画面(logout.php)
・管理画面(admin.php)
・メイン画面(main.php)

それぞれ1つずつプログラミングして作っていきましょう。

スポンサーリンク

【PHP】Twitterみたいなつぶやき投稿アプリを作るためのソースコード(つぶやき画面)

main.php

<?php
session_start();

//ログインの確認
if(isset($_SESSION['login']) == false){
    header('Location: ./login.php');
    exit;
}

$message = 'つぶやきを入力して送信してください。';
$data = [];

//投稿データの保存
if($_SERVER["REQUEST_METHOD"] == 'POST'){
    $arr = [$_POST['msg'],$_SESSION['login']];
    $f = fopen('messages.csv', 'a');
    if($f != false){
        fputcsv($f, $arr);
        fclose($f);
    }
    $message = 'つぶやきを投稿完了!';
}

//CSVデータの読み込み
$f = @fopen('message.csv', 'r');
if($f != false){
    while($row = fgetcsv($f)){
        array_unshift($data, $row);
    }
    fclose($f);
}
?>
<!doctype html>
<html lang="ja">
<head>
	<title>つぶやき投稿アプリ</title>
	<meta charset="utf-8">
	<style>
	body{
	margin: 10px;
	}
	h1{
	color: lightgray;
	font-size: 48pt;
	margin: 0px;
	text-align: right;
	}
    h2{
    font-size: 16pt;    
    }
    h3{
    font-size: 14pt;
    margin: 50 0 10 0;
    }
	p{
	font-size: 14pt;
	}
	p .logout{
	text-align: right;
	}
    th{
    border: 2px solid white;
    padding: 5px;
    background-color: #ddf;
    }
    td{
    border: 1px solid white;
    padding: 5px;
    background-color: #eee;    
    }
	</style>
</head>
<body>
	<h1>つぶやき画面</h1>
	<h2>"<?=isset($_SESSION['login'] ?>"</h2>
	<p><?= $message ?></p>
	<table>
	<form method="post" action=".">
		<tr>
			<th><label>つぶやき:</label></th>
			<td><input type="text" name="msg" size="60"></td>
			<td><input type="text" value="つぶやき"></td>
		</tr>
    </form>
    </table>
    <h3>★投稿されたつぶやき</h3>
    <table>
		<tr>
			<th>つぶやき</th>
			<th>ID</th>
		</tr>
    <?php foreach($data as $item){ ?>
		<tr>
			<td><?= $item[0] ?></td>
			<td><?= $item[1] ?></td>
		</tr>
	<?php } ?>
	</table>
	<p class="logout"><a href="./logout.php">ログアウトする</a></p>
</body>
</html>
タイトルとURLをコピーしました