FriskStudio Code

FriskStudio Code is a lightweight, browser‑based code editor inspired by VS Code, designed by frisk.
It supports Monaco Editor, multi‑language syntax highlighting, HTML live preview, theme switching, and customizable save behavior.

---

🌐 Features

✔ Full Language Selection (One‑by‑One Cards)

FriskStudio Code supports the following languages:

• Web: HTML, CSS, JavaScript, JSON, Node.js
• Script: Python, PHP, Ruby, Perl, Go, Java
• C Family: C, C++, C#, F#, Rust, Objective‑C, Swift
• Markup: SQL, XML, Markdown
• System: PowerShell, Batch, Dockerfile

Each language has its own color‑coded category.

---

🖥 Editor Modes

🔹 HTML Mode

• Left: Monaco Editor
• Right: Live Preview (iframe)
• Preview update mode:
  • Auto Update
  • Ctrl+S Update

🔹 Other Languages

• Full‑screen Monaco Editor
• Download button automatically uses correct extension
  • Example: C# → .cs, XML → .xml, JS → .js

---

⚙ Settings (Left‑Bottom Gear Icon)

The settings modal includes:

🎨 Theme

• Dark Mode
• Light Mode

💾 Save Behavior

• Overwrite loaded file ON/OFF

🌐 HTML Preview Mode

• Auto Update
• Ctrl+S Update

---

🔙 Navigation

• Editor screen includes a ← Back button to return to the language selection screen.

---

🎨 UI Highlights

• Fully color‑coded language cards
• Monaco Editor integration
• Smooth transitions
• Clean, modern layout
• HTML preview panel with border accent
• Responsive design

---

📁 File Download

The editor automatically assigns the correct extension based on the selected language.

Language	Extension
HTML	.html
CSS	.css
JavaScript / Node.js	.js
JSON	.json
Python	.py
PHP	.php
Ruby	.rb
Perl	.pl
Go	.go
C	.c
C++	.cpp
C#	.cs
F#	.fs
Rust	.rs
Objective‑C	.m
Swift	.swift
SQL	.sql
XML	.xml
Markdown	.md
PowerShell	.ps1
Batch	.bat
Dockerfile	Dockerfile
Java	.java

---

🇯🇵 日本語版 README

FriskStudio Code（フリスクスタジオコード）

FriskStudio Code は、friskが設計したブラウザ上で動く VS Code 風エディタです。
Monaco Editor を採用し、多言語対応・HTMLプレビュー・テーマ切替・保存設定などを備えています。

---

🌐 特徴

✔ 言語を1つずつカードで選択

対応言語：

• Web：HTML / CSS / JavaScript / JSON / Node.js
• Script：Python / PHP / Ruby / Perl / Go / Java
• C系：C / C++ / C# / F# / Rust / Objective‑C / Swift
• Markup：SQL / XML / Markdown
• System：PowerShell / Batch / Dockerfile

カテゴリごとに色分けされています。

---

🖥 エディタモード

🔹 HTML の場合

• 左：Monaco Editor
• 右：プレビュー
• プレビュー更新方式：
  • 自動更新
  • Ctrl+S 更新

🔹 その他の言語

• フル画面 Monaco Editor
• ダウンロード時は言語に応じた拡張子で保存

---

⚙ 設定（左下の歯車）

設定モーダルでは以下が変更できます：

🎨 テーマ

• ダークモード
• ホワイトモード

💾 保存設定

• 読み込んだファイルを上書きするかどうか

🌐 HTML プレビュー設定

• 自動更新
• Ctrl+S 更新

---

🔙 戻る機能

エディタ画面の左上に ← 戻る ボタンがあります。

---

📁 ダウンロード

言語に応じて正しい拡張子で保存されます。

---

🧩 使用技術

• Monaco Editor
• HTML / CSS / JavaScript
• iframe Live Preview

---

✨ 作者

frisk-V3

---