Stock Target Price Calculator

https://github.com/syaryn/stock_back_calc
Admin
A tool that calculates theoretical stock prices based on target financial indicators (PER, PBR, and...
Tokens:9,008
Snippets:54
Trust Score:4.6
License:MIT
Update:7 months ago
Show doc for...
Tokens:
Raw
### Accessing Guides via HTTP GET Requests

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Demonstrates how to access English and Japanese guides using curl. It also shows how to simulate auto-redirect based on the browser's Accept-Language header.

```bash
curl -X GET "http://localhost:8000/guide/"

# Japanese guide
curl -X GET "http://localhost:8000/ja/guide/"

# Auto-redirect based on browser language
curl -X GET "http://localhost:8000/guide/" \
  -H "Accept-Language: ja-JP,ja;q=0.9,en;q=0.8"
# Response: 302 Redirect to /ja/guide/
```

--------------------------------

### Start Development Server (Bash)

Source: https://github.com/syaryn/stock_back_calc/blob/main/README.md

Command to start the development server for the Stock Target Price Calculator. Requires Deno or Mise to be installed. The server will be accessible at http://localhost:8000.

```bash
mise run start
# or
deno task start
```

--------------------------------

### Access Guide Page (Bash)

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

This entry represents the documentation for accessing the static guide page. While no code snippet is provided in the input text for this specific route, it is documented as a GET request to '/guide/'. This page explains the calculator's functionality and underlying financial theories.

```bash
# Accessing the static guide page
# curl -X GET "http://localhost:8000/guide/"
```

--------------------------------

### Manage Development and Testing Tasks

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Shell commands for managing the Deno development environment, including starting the server and executing test suites with coverage and specific file filtering.

```bash
deno task dev
mise run start
deno task test
deno task check
deno test --allow-read --allow-env --allow-net utils/pricing_test.ts
deno test --allow-read --allow-env --allow-net main_test.ts
```

--------------------------------

### GET /

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

The main calculator interface. Accepts query parameters to pre-populate calculation fields and supports internationalization via headers and cookies.

```APIDOC
## GET /

### Description
Serves the main calculator interface. Supports pre-population of stock data via query parameters and handles language localization based on browser headers or cookies.

### Method
GET

### Endpoint
/

### Parameters
#### Query Parameters
- **stockPrice** (number) - Optional - Current market price of the stock
- **currentPer** (number) - Optional - Current Price-to-Earnings ratio
- **currentPbr** (number) - Optional - Current Price-to-Book ratio
- **currentYield** (number) - Optional - Current dividend yield percentage
- **targetPer** (number) - Optional - Target P/E ratio for buy price calculation
- **targetPbr** (number) - Optional - Target P/B ratio for buy price calculation
- **targetYield** (number) - Optional - Target dividend yield for buy price calculation
- **lang** (string) - Optional - Force language ('en' or 'ja')

### Request Example
GET /?stockPrice=1000&targetPer=15

### Response
#### Success Response (200)
- **HTML** (text/html) - The rendered calculator page with pre-populated values.
```

--------------------------------

### Perform Unit and Integration Testing

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Deno test suite examples covering fundamental calculations, bottleneck logic, and HTTP route integration. These tests ensure the accuracy of financial derivations and API response headers.

```typescript
import { assertEquals } from "@std/assert";
import { calculateFundamentals, calculateTargetPrices } from "./utils/pricing.ts";

Deno.test("calculateFundamentals correctly derives EPS, BPS, Dividend", () => {
  const state = { price: 1000, per: 20, pbr: 2, yield: 3 };
  const fundamentals = calculateFundamentals(state);
  assertEquals(fundamentals.eps, 50);
  assertEquals(fundamentals.bps, 500);
  assertEquals(fundamentals.dividend, 30);
});

Deno.test("calculateTargetPrices identifies distinct bottleneck", () => {
  const fundamentals = { eps: 100, bps: 1000, dividend: 20 };
  const targets = { per: 10, pbr: 1.2, yield: 1 };
  const prices = calculateTargetPrices(fundamentals, targets);
  assertEquals(prices.minPrice, 1000);
  assertEquals(prices.bottleneck, "per");
});

Deno.test("GET / defaults to English", async () => {
  const req = new Request("http://localhost:8000/");
  const res = await app.request(req);
  assertEquals(res.status, 200);
  assertEquals(res.headers.get("vary"), "Cookie, Accept-Language");
});
```

--------------------------------

### Guide Endpoints

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Endpoints for accessing the English and Japanese guides. The application also supports auto-redirect based on the browser's Accept-Language header.

```APIDOC
## GET /guide/

### Description
Retrieves the guide in English. If the Accept-Language header indicates Japanese, it may redirect to the Japanese version.

### Method
GET

### Endpoint
/guide/

### Request Example
```bash
curl -X GET "http://localhost:8000/guide/"
```

### Response Example
```
(HTML content of the English guide)
```

## GET /ja/guide/

### Description
Retrieves the guide in Japanese.

### Method
GET

### Endpoint
/ja/guide/

### Request Example
```bash
curl -X GET "http://localhost:8000/ja/guide/"
```

### Response Example
```
(HTML content of the Japanese guide)
```

## Auto-redirect based on browser language

### Description
Requests the guide endpoint with an Accept-Language header to trigger language-based redirection.

### Method
GET

### Endpoint
/guide/

### Request Example
```bash
curl -X GET "http://localhost:8000/guide/" \
  -H "Accept-Language: ja-JP,ja;q=0.9,en;q=0.8"
```

### Response Example
```
302 Redirect to /ja/guide/
```
```

--------------------------------

### Access Calculator Page (Bash)

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Demonstrates how to access the main calculator interface using curl. It shows basic requests, pre-populating fields via query parameters, and how language detection and persistence work via headers and cookies. The examples illustrate redirects for different languages and setting user preferences.

```bash
# Basic request - returns English calculator
curl -X GET "http://localhost:8000/"

# Pre-populate calculator with stock data via query params
curl -X GET "http://localhost:8000/?stockPrice=1000&currentPer=20&currentPbr=2&currentYield=3&targetPer=15&targetPbr=1.5&targetYield=4"

# Japanese browser gets redirected to /ja/
curl -X GET "http://localhost:8000/" \
  -H "Accept-Language: ja,en-US;q=0.9,en;q=0.8"
# Response: 302 Redirect to http://localhost:8000/ja/

# Direct Japanese version
curl -X GET "http://localhost:8000/ja/"

# Persist language preference (redirects and sets cookie)
curl -X GET "http://localhost:8000/?lang=ja"
# Response: 301 Redirect to /ja/ with Set-Cookie: preferred_lang=ja

# Request with existing language preference cookie
curl -X GET "http://localhost:8000/" \
  -H "Cookie: preferred_lang=ja"
# Response: 302 Redirect to /ja/
```

--------------------------------

### Rendering Layout and Calculator View Components

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Shows how to use a base HTML layout component with SEO metadata and structured data. It includes examples for rendering the main calculator page and article pages, specifying page types and passing relevant data.

```typescript
import { Layout } from "./views/Layout.tsx";
import { Calculator } from "./views/Calculator.tsx";

// Render calculator page with full layout
app.get("/", (c) => {
  const t = i18next.getFixedT("en");

  return c.html(
    <Layout
      title={t("title")}
      description={t("description")}
      lang="en"
      pathLang={undefined}
      canonicalPath="/"
      pageType="website"
    >
      <Calculator
        lang="en"
        initialState={{ price: 1000, per: 20, pbr: 2, yield: 3 }}
        initialTargets={{ per: 15, pbr: 1.5, yield: 4 }}
        queryParams={{}}
        pathLang={undefined}
      />
    </Layout>
  );
});

// Render article pages with Article structured data
app.get("/guide/", (c) => {
  const t = i18next.getFixedT("en");
  const articleJson = {
    "@context": "https://schema.org",
    "@type": "Article",
    headline: t("guideTitle"),
    description: t("guideDescription"),
    inLanguage: "en",
    url: "https://stock-back-calc.syaryn.com/guide/",
  };

  return c.html(
    <Layout
      title={t("guideTitle")}
      description={t("guideDescription")}
      lang="en"
      canonicalPath="/guide/"
      pageType="article"
      structuredData={[articleJson]}
    >
      <Guide lang="en" />
    </Layout>
  );
});
```

--------------------------------

### Accessing About Page via HTTP GET Requests

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Shows how to retrieve information about the calculator's purpose and features from both the English and Japanese 'About' pages using curl.

```bash
# English about page
curl -X GET "http://localhost:8000/about/"

# Japanese about page
curl -X GET "http://localhost:8000/ja/about/"
```

--------------------------------

### Layout Component Rendering

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Examples of rendering the base HTML layout component, including calculator pages and article pages with structured data.

```APIDOC
## Layout Component Rendering Examples

### Description
Demonstrates how to use the `Layout` component to render different types of pages, such as the main calculator interface and article pages, with appropriate SEO metadata and structured data.

### Method
N/A (Code examples)

### Endpoint
N/A

### Parameters
N/A

### Request Example
```typescript
import { Layout } from "./views/Layout.tsx";
import { Calculator } from "./views/Calculator.tsx";

// Render calculator page with full layout
app.get("/", (c) => {
  const t = i18next.getFixedT("en");

  return c.html(
    <Layout
      title={t("title")}
      description={t("description")}
      lang="en"
      pathLang={undefined}
      canonicalPath="/"
      pageType="website"
    >
      <Calculator
        lang="en"
        initialState={{ price: 1000, per: 20, pbr: 2, yield: 3 }}
        initialTargets={{ per: 15, pbr: 1.5, yield: 4 }}
        queryParams={{}}
        pathLang={undefined}
      />
    </Layout>
  );
});

// Render article pages with Article structured data
app.get("/guide/", (c) => {
  const t = i18next.getFixedT("en");
  const articleJson = {
    "@context": "https://schema.org",
    "@type": "Article",
    headline: t("guideTitle"),
    description: t("guideDescription"),
    inLanguage: "en",
    url: "https://stock-back-calc.syaryn.com/guide/",
  };

  return c.html(
    <Layout
      title={t("guideTitle")}
      description={t("guideDescription")}
      lang="en"
      canonicalPath="/guide/"
      pageType="article"
      structuredData={[articleJson]}
    >
      <Guide lang="en" />
    </Layout>
  );
});
```

### Response
#### Success Response (200)
N/A (Code rendering examples)

#### Response Example
N/A
```

--------------------------------

### Run Test Suite (Bash)

Source: https://github.com/syaryn/stock_back_calc/blob/main/README.md

Command to execute the test suite, including integration and unit tests, for the Stock Target Price Calculator. Requires Deno or Mise to be installed.

```bash
mise run check
# or
deno task check
```

--------------------------------

### i18next Language Configuration and Translation

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Illustrates how to configure i18next for internationalization, setting default and available locales. It shows how to get translation functions for specific languages and use them to translate strings and access nested translation objects like FAQ items.

```typescript
import i18next, { Language, i18nConfig } from "./utils/i18n.ts";

// Available configuration
console.log(i18nConfig);
// { defaultLocale: "en", locales: ["en", "ja"] }

// Get translation function for specific language
const tEn = i18next.getFixedT("en");
const tJa = i18next.getFixedT("ja");

// Use translations
console.log(tEn("stockPrice"));        // "Stock Price"
console.log(tJa("stockPrice"));        // "株価"

console.log(tEn("currentPer"));        // "Current PER"
console.log(tJa("currentPer"));        // "現在 PER"

console.log(tEn("bottleneck"));        // "Bottleneck Indicator"
console.log(tJa("bottleneck"));        // "ボトルネック指標"

// Access FAQ items
const faqItems = tEn("faq", { returnObjects: true });
// Returns array of { q: string, a: string } objects
```

--------------------------------

### Client-side Calculation and UI Reflection with Alpine.js

Source: https://github.com/syaryn/stock_back_calc/blob/main/docs/gist/article_2_implementation_en.md

This example shows how Alpine.js handles client-side calculations and UI updates. It uses `x-data` to define state, `x-model` to bind input values, and `x-text` to display computed results. This approach delegates calculations that don't require server interaction to the browser, simplifying the overall architecture.

```html
<div
  x-data="{
    currentPrice: 1000,
    targetReturn: 10,
    get targetPrice() {
        return this.currentPrice * (1 + this.targetReturn / 100);
    }
}"
>
  <label>
    Current Price:
    <input type="number" x-model.number="currentPrice">
  </label>
  <label>
    Target Return (%):
    <input type="number" x-model.number="targetReturn">
  </label>

  <p>Target Price: <span x-text="targetPrice"></span> JPY</p>
</div>
```

--------------------------------

### Accessing SEO Endpoints (robots.txt and sitemap.xml)

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Demonstrates how to fetch the robots.txt file, which controls search engine crawling, and the sitemap.xml file, which lists all localized URLs for better SEO.

```bash
# Robots.txt
curl -X GET "http://localhost:8000/robots.txt"
# Response:
# User-agent: *
# Allow: /
# Sitemap: https://stock-back-calc.syaryn.com/sitemap.xml

# Sitemap with all localized URLs
curl -X GET "http://localhost:8000/sitemap.xml"
# Returns XML sitemap with hreflang alternates for all pages
```

--------------------------------

### Define Deno Hono Web Stack Skill Configuration

Source: https://github.com/syaryn/stock_back_calc/blob/main/docs/gist/article_1_skill_creation_en.md

A Markdown-based definition file (SKILL.md) that provides the AI agent with metadata, usage instructions, and quick-start procedures for the Deno/Hono web stack.

```markdown
---
name: deno-hono-web-stack
description: Expert assistance for developing web applications using Deno, Hono, Htmx, PicoCSS, Alpine.js, and Lefthook.
---

# Deno Hono Web Stack Skill

## When to use this skill

- Setting up a new web project with the Deno/Hono stack.
- Implementing server-side rendering (SSR) with Hono's JSX middleware.

## Quick Start (New Project)

To create a new project using the bundled template:

1. Copy the contents of `resources/template/` to the project root.
2. Run `mise install` to set up the environment.
```

--------------------------------

### Semantic HTML Structure with Pico.css

Source: https://github.com/syaryn/stock_back_calc/blob/main/docs/gist/article_2_implementation_en.md

This snippet illustrates the use of Pico.css for UI design by leveraging semantic HTML tags. By simply using elements like `<article>`, `<header>`, and `<footer>`, the framework automatically applies responsive layouts and a clean design without requiring explicit CSS classes.

```html
<article>
  <header>Result</header>
  ...
  <footer>
    <button class="secondary">Reset</button>
  </footer>
</article>
```

--------------------------------

### About Page

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Endpoints for accessing the about page, which provides information about the calculator's purpose, logic, and FAQs. Available in English and Japanese.

```APIDOC
## GET /about/

### Description
Retrieves the about page in English, detailing the calculator's purpose, use cases, calculation logic, and FAQs.

### Method
GET

### Endpoint
/about/

### Request Example
```bash
curl -X GET "http://localhost:8000/about/"
```

### Response Example
```
(HTML content of the English about page)
```

## GET /ja/about/

### Description
Retrieves the about page in Japanese, detailing the calculator's purpose, use cases, calculation logic, and FAQs.

### Method
GET

### Endpoint
/ja/about/

### Request Example
```bash
curl -X GET "http://localhost:8000/ja/about/"
```

### Response Example
```
(HTML content of the Japanese about page)
```
```

--------------------------------

### Internationalization (i18n) Configuration

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Details on the i18next configuration, including available locales, translation functions, and accessing localized content.

```APIDOC
## i18next Configuration

### Description
Information about the i18next internationalization setup, including default locale, supported languages, and how to retrieve translations.

### Method
N/A (Configuration details)

### Endpoint
N/A

### Parameters
#### Query Parameters
N/A

#### Request Body
N/A

### Request Example
```typescript
import i18next, { Language, i18nConfig } from "./utils/i18n.ts";

// Available configuration
console.log(i18nConfig); // { defaultLocale: "en", locales: ["en", "ja"] }

// Get translation function for specific language
const tEn = i18next.getFixedT("en");
const tJa = i18next.getFixedT("ja");

// Use translations
console.log(tEn("stockPrice")); // "Stock Price"
console.log(tJa("stockPrice")); // "株価"

// Access FAQ items
const faqItems = tEn("faq", { returnObjects: true }); // Returns array of { q: string, a: string } objects
```

### Response
#### Success Response (200)
N/A (This is a configuration example)

#### Response Example
N/A
```

--------------------------------

### SEO Endpoints

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Endpoints for robots.txt and sitemap.xml, crucial for search engine optimization and discoverability.

```APIDOC
## GET /robots.txt

### Description
Provides instructions to web crawlers regarding which parts of the site should not be indexed.

### Method
GET

### Endpoint
/robots.txt

### Request Example
```bash
curl -X GET "http://localhost:8000/robots.txt"
```

### Response Example
```
User-agent: *
Allow: /
Sitemap: https://stock-back-calc.syaryn.com/sitemap.xml
```

## GET /sitemap.xml

### Description
Returns an XML sitemap containing all localized URLs and hreflang alternates for improved SEO.

### Method
GET

### Endpoint
/sitemap.xml

### Request Example
```bash
curl -X GET "http://localhost:8000/sitemap.xml"
```

### Response Example
```
(XML content of the sitemap)
```
```

--------------------------------

### Language Detection and Persistence

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Logic for detecting the preferred language from the Accept-Language header and persisting the user's language preference in a cookie.

```APIDOC
## Language Detection and Persistence Logic

### Description
Provides the implementation details for detecting the user's preferred language based on the `Accept-Language` header and persisting this choice via cookies.

### Method
N/A (Code implementation details)

### Endpoint
N/A

### Parameters
#### Path Parameters
N/A

#### Query Parameters
N/A

#### Request Body
N/A

### Request Example
```typescript
import { Context, Hono } from "hono";
import { getCookie, setCookie } from "hono/cookie";

// Parse Accept-Language header to determine preferred language
function getPreferredLanguage(acceptLanguage: string | undefined): "en" | "ja" {
  if (!acceptLanguage) return "en";

  const languages = acceptLanguage
    .split(",")
    .map((entry) => {
      const [tagPart, ...params] = entry.trim().split(";");
      const tag = tagPart.toLowerCase();
      const qValue = params.find((p) => p.trim().startsWith("q="))?.split("=")[1];
      const q = qValue ? parseFloat(qValue) : 1;
      return { tag, q: isFinite(q) ? q : 0 };
    })
    .filter((e) => e.tag.length > 0 && e.q > 0)
    .sort((a, b) => b.q - a.q);

  for (const { tag } of languages) {
    if (tag === "ja" || tag.startsWith("ja-")) return "ja";
    if (tag === "en" || tag.startsWith("en-")) return "en";
  }
  return "en";
}

// Persist language preference in cookie
function persistPreferredLanguage(c: Context, lang: "en" | "ja") {
  setCookie(c, "preferred_lang", lang, {
    path: "/",
    maxAge: 60 * 60 * 24 * 365,  // 1 year
    sameSite: "Lax",
    httpOnly: true,
  });
}
```

### Response
#### Success Response (200)
N/A (Code implementation)

#### Response Example
N/A
```

--------------------------------

### Calculate Target Buy Prices (TypeScript)

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Computes target buy prices based on desired valuation metrics and identifies the most conservative constraint (bottleneck). It takes fundamental metrics and target valuation ratios as input, returning individual prices for each metric, the minimum price, and the bottleneck indicator. This function helps determine the optimal buy price considering multiple valuation methods.

```typescript
import { calculateFundamentals, calculateTargetPrices } from "./utils/pricing.ts";

// First, derive fundamentals from current market state
const fundamentals = calculateFundamentals({
  price: 1000,
  per: 20,
  pbr: 2,
  yield: 3,
});
// Result: { eps: 50, bps: 500, dividend: 30 }

// Define your target valuation metrics
const targets = {
  per: 15,      // Want to buy at PER 15 or lower
  pbr: 1.5,     // Want to buy at PBR 1.5 or lower
  yield: 4,     // Want 4% dividend yield or higher
};

const targetPrices = calculateTargetPrices(fundamentals, targets);

console.log(targetPrices);
// Output:
// {
//   perPrice: 750,      // EPS (50) * Target PER (15) = 750
//   pbrPrice: 750,      // BPS (500) * Target PBR (1.5) = 750
//   yieldPrice: 750,    // Dividend (30) / Target Yield (0.04) = 750
//   minPrice: 750,      // Lowest of all calculated prices
//   bottleneck: "per"   // Which indicator produces the min price
// }

// Example with distinct bottleneck
const aggressiveTargets = {
  per: 10,      // Aggressive: PER 10
  pbr: 1.2,     // Moderate: PBR 1.2
  yield: 1,     // Relaxed: 1% yield
};

const results = calculateTargetPrices(
  { eps: 100, bps: 1000, dividend: 20 },
  aggressiveTargets
);
// Output:
// {
//   perPrice: 1000,     // 100 * 10 = 1000 (lowest - bottleneck)
//   pbrPrice: 1200,     // 1000 * 1.2 = 1200
//   yieldPrice: 2000,   // 20 / 0.01 = 2000
//   minPrice: 1000,
//   bottleneck: "per"
// }
```

--------------------------------

### Implement Alpine.js Calculator Component

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Defines a reactive data model for stock calculations including market values, target metrics, and URL state synchronization. It uses computed properties to derive fundamentals and implied metrics based on user input.

```typescript
Alpine.data('calculator', () => ({
  stockPrice: null,
  currentPer: null,
  currentPbr: null,
  currentYield: null,
  targetPer: null,
  targetPbr: null,
  targetYield: null,
  targetPerDirty: false,
  targetPbrDirty: false,
  targetYieldDirty: false,
  get fundamentals() {
    return calculateFundamentals({
      price: this.stockPrice,
      per: this.currentPer,
      pbr: this.currentPbr,
      yield: this.currentYield,
    });
  },
  get results() {
    return calculateTargetPrices(this.fundamentals, {
      per: this.targetPer,
      pbr: this.targetPbr,
      yield: this.targetYield,
    });
  },
  get implied() {
    const p = this.results.minPrice;
    if (!p || !this.fundamentals) return null;
    return {
      per: this.fundamentals.eps ? p / this.fundamentals.eps : null,
      pbr: this.fundamentals.bps ? p / this.fundamentals.bps : null,
      yield: this.fundamentals.dividend ? (this.fundamentals.dividend / p) * 100 : null,
    };
  },
  updateUrl() {
    const params = new URLSearchParams();
    if (this.stockPrice) params.set('stockPrice', this.stockPrice);
    if (this.currentPer) params.set('currentPer', this.currentPer);
    if (this.currentPbr) params.set('currentPbr', this.currentPbr);
    if (this.currentYield) params.set('currentYield', this.currentYield);
    if (this.targetPer) params.set('targetPer', this.targetPer);
    if (this.targetPbr) params.set('targetPbr', this.targetPbr);
    if (this.targetYield) params.set('targetYield', this.targetYield);
    const search = params.toString() ? '?' + params.toString() : '';
    window.history.replaceState({}, '', window.location.pathname + search);
  }
}));
```

--------------------------------

### Language Detection and Persistence Logic

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Provides TypeScript functions for determining the user's preferred language based on the 'Accept-Language' header and for persisting this preference in an HTTP cookie. This is crucial for internationalization.

```typescript
import { Context, Hono } from "hono";
import { getCookie, setCookie } from "hono/cookie";

// Parse Accept-Language header to determine preferred language
function getPreferredLanguage(acceptLanguage: string | undefined): "en" | "ja" {
  if (!acceptLanguage) return "en";

  const languages = acceptLanguage
    .split(",")
    .map((entry) => {
      const [tagPart, ...params] = entry.trim().split(";");
      const tag = tagPart.toLowerCase();
      const qValue = params.find((p) => p.trim().startsWith("q="))?.split("=")[1];
      const q = qValue ? parseFloat(qValue) : 1;
      return { tag, q: isFinite(q) ? q : 0 };
    })
    .filter((e) => e.tag.length > 0 && e.q > 0)
    .sort((a, b) => b.q - a.q);

  for (const { tag } of languages) {
    if (tag === "ja" || tag.startsWith("ja-")) return "ja";
    if (tag === "en" || tag.startsWith("en-")) return "en";
  }
  return "en";
}

// Persist language preference in cookie
function persistPreferredLanguage(c: Context, lang: "en" | "ja") {
  setCookie(c, "preferred_lang", lang, {
    path: "/",
    maxAge: 60 * 60 * 24 * 365,  // 1 year
    sameSite: "Lax",
    httpOnly: true,
  });
}
```

--------------------------------

### Utility: calculateTargetPrices

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Computes target buy prices based on target valuation metrics and identifies the bottleneck indicator.

```APIDOC
## calculateTargetPrices

### Description
Computes the buy price for each metric and determines the most conservative (minimum) price and the bottleneck indicator.

### Request Body
- **fundamentals** (object) - Required - Object containing eps, bps, and dividend
- **targets** (object) - Required - Object containing target per, pbr, and yield

### Response
#### Success Response (200)
- **perPrice** (number) - Calculated price based on target PER
- **pbrPrice** (number) - Calculated price based on target PBR
- **yieldPrice** (number) - Calculated price based on target Yield
- **minPrice** (number) - The lowest of the three calculated prices
- **bottleneck** (string) - The indicator name that resulted in the minPrice
```

--------------------------------

### Server-Side Rendering with Hono JSX Middleware

Source: https://github.com/syaryn/stock_back_calc/blob/main/docs/gist/article_2_implementation_en.md

This snippet demonstrates Server-Side Rendering (SSR) using Hono's JSX Middleware. It converts JSX syntax into HTML strings on the server, ensuring fast initial page loads. The `c.html()` function renders the provided JSX structure within a `Layout` component.

```tsx
app.get('/', (c) => {
  return c.html(
    <Layout>
      <main class="container">
        <h1>Stock Target Price Calculator</h1>
        {/* ... */}
      </main>
    </Layout>
  )
})
```

--------------------------------

### Utility: calculateFundamentals

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Derives fundamental financial metrics (EPS, BPS, and annual dividend) from current market data.

```APIDOC
## calculateFundamentals

### Description
Calculates EPS, BPS, and annual dividend based on current market price and valuation ratios.

### Request Body
- **price** (number) - Required - Current stock price
- **per** (number) - Required - Current P/E ratio
- **pbr** (number) - Required - Current P/B ratio
- **yield** (number) - Required - Current dividend yield

### Response
#### Success Response (200)
- **eps** (number) - Earnings Per Share
- **bps** (number) - Book Value Per Share
- **dividend** (number) - Annual dividend amount
```

--------------------------------

### Calculate Stock Fundamentals (TypeScript)

Source: https://context7.com/syaryn/stock_back_calc/llms.txt

Derives fundamental financial metrics like EPS, BPS, and annual dividend from current stock price and valuation ratios. This function is crucial for subsequent reverse price calculations. It takes a MarketState object as input and returns an object containing the calculated fundamentals.

```typescript
import { calculateFundamentals, MarketState } from "./utils/pricing.ts";

// Define current market state for a stock
const marketState: MarketState = {
  price: 1000,      // Current stock price
  per: 20,          // Price-to-Earnings Ratio (P/E)
  pbr: 2,           // Price-to-Book Ratio (P/B)
  yield: 3,         // Dividend yield in percentage
};

const fundamentals = calculateFundamentals(marketState);

console.log(fundamentals);
// Output:
// {
//   eps: 50,        // EPS = price / PER = 1000 / 20
//   bps: 500,       // BPS = price / PBR = 1000 / 2
//   dividend: 30    // Annual dividend = price * (yield / 100) = 1000 * 0.03
// }
```
Tokens:
Raw