programming - 長留裕平のブログ

PHP in_array､array_search

<?php
$names = ["Taro", "Jiro", "Saburo"];
echo array_search("Jiro", $names) .PHP_EOL;

PHP 配列

<?php
$scores = [70, 90, 80];
// echo $scores[0] . PHP_EOL;
// $scores[1] = 95;
// echo $scores[1] . PHP_EOL;
var_dump($scores);
print_r($scores);

ドメイン取得サイト.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Domain Acquisition</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        .container {
            background-color: #fff;
            padding: 20px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            border-radius: 8px;
            text-align: center;
            width: 100%;
            max-width: 600px;
        }
        h1 {
            margin-bottom: 20px;
        }
        input[type="text"] {
            width: 80%;
            padding: 10px;
            margin: 10px 0;
            border: 1px solid #ccc;
            border-radius: 5px;
            font-size: 16px;
        }
        button {
            padding: 10px 20px;
            border: none;
            background-color: #007BFF;
            color: white;
            font-size: 16px;
            border-radius: 5px;
            cursor: pointer;
        }
        button:hover {
            background-color: #0056b3;
        }
        .result {
            margin-top: 20px;
        }
        .loading {
            display: none;
            margin-top: 20px;
        }
        .domain-list {
            margin-top: 20px;
        }
        .domain-list ul {
            list-style-type: none;
            padding: 0;
        }
        .domain-list li {
            background-color: #f9f9f9;
            margin: 10px 0;
            padding: 10px;
            border-radius: 5px;
            border: 1px solid #ddd;
            text-align: left;
            display: flex;
            justify-content: space-between;
        }
        .price {
            color: green;
        }
        .purchase-link {
            text-decoration: none;
            background-color: #28a745;
            color: white;
            padding: 5px 10px;
            border-radius: 5px;
        }
        .error {
            color: red;
            margin-top: 20px;
        }
        @media (max-width: 600px) {
            input[type="text"] {
                width: 100%;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Check Domain Availability</h1>
        <form id="domain-form">
            <input type="text" id="domain-name" placeholder="Enter domain name" required>
            <button type="submit">Search</button>
        </form>
        <div class="loading" id="loading">
            <p>Searching...</p>
            <img src="https://i.gifer.com/ZZ5H.gif" alt="Loading" width="50">
        </div>
        <div class="result" id="result"></div>
        <div class="error" id="error"></div>
        <div class="domain-list" id="domain-list"></div>
    </div>

    <script>
        const form = document.getElementById('domain-form');
        const resultDiv = document.getElementById('result');
        const loadingDiv = document.getElementById('loading');
        const errorDiv = document.getElementById('error');
        const domainListDiv = document.getElementById('domain-list');

        form.addEventListener('submit', function (event) {
            event.preventDefault();

            const domainName = document.getElementById('domain-name').value.trim();

            // フィールドをリセット
            resultDiv.innerHTML = '';
            errorDiv.innerHTML = '';
            domainListDiv.innerHTML = '';
            loadingDiv.style.display = 'block'; // ローディング表示

            if (validateDomainName(domainName)) {
                // ダミーデータの使用例（実際にはAPIを呼び出します）
                setTimeout(() => {
                    loadingDiv.style.display = 'none'; // ローディング終了

                    // 検索結果の仮表示
                    const available = Math.random() > 0.5; // ランダムに結果を生成

                    if (available) {
                        resultDiv.innerHTML = `<strong>${domainName}</strong> is available!`;

                        // 他のTLDを提案し、価格と購入リンクを表示
                        const suggestions = [
                            { tld: '.com', price: '$10.99', link: 'https://buydomain.com/com' },
                            { tld: '.net', price: '$9.99', link: 'https://buydomain.com/net' },
                            { tld: '.org', price: '$11.99', link: 'https://buydomain.com/org' },
                            { tld: '.info', price: '$8.99', link: 'https://buydomain.com/info' },
                            { tld: '.co', price: '$12.99', link: 'https://buydomain.com/co' }
                        ];
                        let domainList = '<ul>';
                        suggestions.forEach(({ tld, price, link }) => {
                            domainList += `<li>${domainName}${tld} <span class="price">${price}</span> <a href="${link}" target="_blank" class="purchase-link">Buy</a></li>`;
                        });
                        domainList += '</ul>';
                        domainListDiv.innerHTML = domainList;

                    } else {
                        resultDiv.innerHTML = `<strong>${domainName}</strong> is already taken.`;
                    }

                }, 2000); // 実際のAPIではこのタイミングで結果を取得
            } else {
                errorDiv.innerHTML = 'Please enter a valid domain name. It should follow the format: example.com';
                loadingDiv.style.display = 'none'; // エラー時はローディングを停止
            }
        });

        // ドメイン名のバリデーション関数
        function validateDomainName(domain) {
            const domainPattern = /^[a-zA-Z0-9-]{1,63}\.[a-zA-Z]{2,}$/;
            return domainPattern.test(domain);
        }
    </script>
</body>
</html>

PHP 無名関数

<?php
// function triple($num)
// {
//     return $num * 3;
// }

// $triple = function($num)
// {
//     return $num * 3;
// };

$triple = fn($num) => $num * 3;

echo $triple(10) . PHP_EOL;

PHP 関数

<?php
function showAd()
{
    echo "---------" . PHP_EOL;
    echo "SALE! 50% OFF!" . PHP_EOL;
    echo "---------" . PHP_EOL;
}

function showContent()
{
    echo "BREAKING NEWS!" . PHP_EOL;
    echo "Two baby pandas born at our Zoo!" . PHP_EOL;
}

showAd();
showContent();
showAd();

PHP 実引数

<?php
function printMessage($from, $to)
{
    echo "Hi {$to}! from { $from}" . PHP_EOL;
}

printMessage(from: "Taro", to: "Jiro");
printMessage(to: "Shiro", from: "Saburo");

To create a video-sharing website using Node.js, you’ll need to set up a few essential components for handling file uploads, video storage, streaming, and user interactions. Here’s a high-level guide to help you get started:

1. Initial Setup

Install Node.js and npm (Node Package Manager).
Create a new project:bashコードをコピーするmkdir video-sharing-site cd video-sharing-site npm init -y
Install necessary packages:bashコードをコピーするnpm install express multer mongoose ffmpeg fluent-ffmpeg

2. Create Server with Express

Set up an Express server to handle requests.
Add routes for uploading videos and fetching video data.

Example: Basic server setup in app.js:

javascriptコードをコピーするconst express = require('express');
const app = express();
const port = 3000;

app.get('/', (req, res) => {
  res.send('Welcome to the Video Sharing Website');
});

app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});

3. Video Upload Feature

Use multer to handle file uploads.
Store videos on the server or a cloud storage service (e.g., AWS S3, Google Cloud Storage).

Example: Video upload route:

javascriptコードをコピーするconst multer = require('multer');
const path = require('path');

const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'uploads/videos/');
  },
  filename: function (req, file, cb) {
    cb(null, Date.now() + path.extname(file.originalname));
  },
});

const upload = multer({ storage: storage });

app.post('/upload', upload.single('video'), (req, res) => {
  res.send('Video uploaded successfully');
});

4. Video Streaming

Serve videos using streams for efficient delivery.

Example: Stream a video from the server:

javascriptコードをコピーするconst fs = require('fs');
const path = require('path');

app.get('/video/:filename', (req, res) => {
  const filePath = path.join(__dirname, 'uploads/videos', req.params.filename);
  const stat = fs.statSync(filePath);
  const fileSize = stat.size;
  const range = req.headers.range;

  if (range) {
    const parts = range.replace(/bytes=/, "").split("-");
    const start = parseInt(parts[0], 10);
    const end = parts[1] ? parseInt(parts[1], 10) : fileSize - 1;

    const chunksize = (end - start) + 1;
    const file = fs.createReadStream(filePath, { start, end });
    const head = {
      'Content-Range': `bytes ${start}-${end}/${fileSize}`,
      'Accept-Ranges': 'bytes',
      'Content-Length': chunksize,
      'Content-Type': 'video/mp4',
    };

    res.writeHead(206, head);
    file.pipe(res);
  } else {
    const head = {
      'Content-Length': fileSize,
      'Content-Type': 'video/mp4',
    };
    res.writeHead(200, head);
    fs.createReadStream(filePath).pipe(res);
  }
});

5. Database Setup (MongoDB)

Use MongoDB to store metadata about videos, users, comments, etc.
Example schema for storing video data:

javascriptコードをコピーするconst mongoose = require('mongoose');

const videoSchema = new mongoose.Schema({
  title: String,
  description: String,
  filename: String,
  uploadedAt: { type: Date, default: Date.now },
});

const Video = mongoose.model('Video', videoSchema);

6. Video Processing (Optional)

Use ffmpeg for video encoding, format conversion, or generating thumbnails.

Example: Generate a thumbnail:

javascriptコードをコピーするconst ffmpeg = require('fluent-ffmpeg');

const generateThumbnail = (videoPath, outputPath) => {
  ffmpeg(videoPath)
    .screenshots({
      count: 1,
      folder: outputPath,
      filename: 'thumbnail.png',
      size: '320x240',
    });
};

7. Frontend Development

Use HTML, CSS, and JavaScript (React, Vue.js, etc.) to create a user-friendly frontend.
Handle video upload forms, video players (use video.js or native HTML5 <video>), and user interactions.

8. User Authentication

Set up user authentication with tools like passport.js or JWT to allow user registration, login, and personalized video libraries.

9. Deployment

Use cloud platforms like AWS, DigitalOcean, or Heroku to deploy your video-sharing platform.
Consider optimizing video storage and delivery using CDNs (Content Delivery Networks) like Cloudflare.

By following these steps, you’ll have a basic Node.js-based video-sharing website. If you need further details on any of these steps, feel free to ask!

node-js todo-list

Node.js での Todo リストの基本的なファイル構造と実装例を示します。

ファイル構造

javaコードをコピーする/todo-app
  ├── /node_modules    // npmパッケージ
  ├── /public          // 静的ファイル（CSS, JSなど）
  │   └── style.css
  ├── /views           // テンプレートファイル（HTML, EJSなど）
  │   └── index.ejs
  ├── /routes          // ルーティングファイル
  │   └── todos.js
  ├── app.js           // メインのアプリケーションファイル
  ├── package.json     // npmパッケージ設定ファイル
  └── README.md        // 説明書

1. `package.json`

jsonコードをコピーする{
  "name": "todo-app",
  "version": "1.0.0",
  "description": "Simple Todo app with Node.js",
  "main": "app.js",
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "^4.18.0",
    "ejs": "^3.1.6",
    "body-parser": "^1.19.0"
  }
}

2. `app.js`

jsコードをコピーするconst express = require('express');
const bodyParser = require('body-parser');
const app = express();
const todoRoutes = require('./routes/todos');

app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static('public'));

app.use('/', todoRoutes);

app.listen(3000, () => {
  console.log('Todo app running on port 3000');
});

3. `routes/todos.js`

jsコードをコピーするconst express = require('express');
const router = express.Router();

let todos = [];

router.get('/', (req, res) => {
  res.render('index', { todos });
});

router.post('/add', (req, res) => {
  const newTodo = req.body.todo;
  if (newTodo) {
    todos.push(newTodo);
  }
  res.redirect('/');
});

router.post('/delete/:index', (req, res) => {
  const index = req.params.index;
  if (index >= 0 && index < todos.length) {
    todos.splice(index, 1);
  }
  res.redirect('/');
});

module.exports = router;

4. `views/index.ejs`

htmlコードをコピーする<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Todo App</title>
  <link rel="stylesheet" href="/style.css">
</head>
<body>
  <h1>Todo List</h1>
  <form action="/add" method="POST">
    <input type="text" name="todo" placeholder="Add a new task" required>
    <button type="submit">Add</button>
  </form>
  <ul>
    <% todos.forEach((todo, index) => { %>
      <li>
        <%= todo %> 
        <form action="/delete/<%= index %>" method="POST" style="display:inline;">
          <button type="submit">Delete</button>
        </form>
      </li>
    <% }) %>
  </ul>
</body>
</html>

5. `public/style.css`

cssコードをコピーするbody {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  text-align: center;
}

h1 {
  margin-top: 20px;
}

form {
  margin-bottom: 20px;
}

ul {
  list-style-type: none;
  padding: 0;
}

li {
  margin: 5px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

button {
  margin-left: 10px;
}

このコードは、Node.js を使用してシンプルな Todo リストを作成する基本構造を示しています。 express フレームワークを使ってルーティングを行い、 ejs を使ってテンプレートを表示しています。

あなた:

コマンド

ChatGPT:

ChatGPT

以下は、Node.js での Todo リストアプリを実行するためのコマンドの手順です。

1. プロジェクトの初期化

最初に新しいプロジェクトフォルダを作成し、その中でプロジェクトを初期化します。

bashコードをコピーするmkdir todo-app
cd todo-app
npm init -y

npm init -y で package.json ファイルが自動生成されます。

2. 必要なパッケージのインストール

express, ejs, body-parser などの必要なパッケージをインストールします。

bashコードをコピーするnpm install express ejs body-parser

3. アプリケーションの起動

app.js を実行して、アプリケーションを起動します。

bashコードをコピーするnode app.js

このコマンドを実行後、ブラウザで http://localhost:3000 にアクセスして Todo リストアプリを確認できます。

4. 開発中に自動的に再起動させたい場合 (オプション)

開発中に変更を加えるたびにサーバーを自動的に再起動させたい場合は、nodemon を使用すると便利です。

bashコードをコピーするnpm install -g nodemon
nodemon app.js

nodemon を使うと、コードを変更するたびにサーバーが自動でリスタートします。

確認事項

コマンドはプロジェクトディレクトリ内で実行してください。
ブラウザから http://localhost:3000 へアクセスして動作確認ができます。

PHP 複数のreturn

<?php
function getTotal($price, $amount, $rate = 1.1)
{
    if($amount >= 100){
        return $price * $amount;
    }else{
        return $price * $amount * $rate;
    }
}

echo getTotal(100, 100) . PHP_EOL;
echo getTotal(1000, 10) . PHP_EOL;

PHP 関数引数のデフォルト値

<?php
function getTotal($price, $rate = 1.1, $amount)
{
    return $price * $amount * $rate;
}

echo getTotal(100, 10) . PHP_EOL;
echo getTotal(150, 20) . PHP_EOL;
echo getTotal(200, 30) . PHP_EOL;
echo getTotal(120, 40, 1.08) . PHP_EOL;

タグ: programming

PHP in_array､array_search

PHP 配列

ドメイン取得サイト.html

PHP 無名関数

PHP 関数

PHP 実引数

node-js 動画共有サイト

1. Initial Setup

2. Create Server with Express

3. Video Upload Feature

4. Video Streaming

5. Database Setup (MongoDB)

6. Video Processing (Optional)

7. Frontend Development

8. User Authentication

9. Deployment

node-js todo-list

ファイル構造

1. `package.json`

2. `app.js`

3. `routes/todos.js`

4. `views/index.ejs`

5. `public/style.css`

あなた:

ChatGPT:

1. プロジェクトの初期化

2. 必要なパッケージのインストール

3. アプリケーションの起動

4. 開発中に自動的に再起動させたい場合 (オプション)

確認事項

PHP 複数のreturn

PHP 関数引数のデフォルト値

1. Initial Setup

2. Create Server with Express

3. Video Upload Feature

4. Video Streaming

5. Database Setup (MongoDB)

6. Video Processing (Optional)

7. Frontend Development

8. User Authentication

9. Deployment

ファイル構造

1. package.json

2. app.js

3. routes/todos.js

4. views/index.ejs

5. public/style.css

あなた:

ChatGPT:

1. プロジェクトの初期化

2. 必要なパッケージのインストール

3. アプリケーションの起動

4. 開発中に自動的に再起動させたい場合 (オプション)

確認事項

1. `package.json`

2. `app.js`

3. `routes/todos.js`

4. `views/index.ejs`

5. `public/style.css`