change doc to nextjs 14

docs/.editorconfig

@@ -0,0 +1,12 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+indent_style = tab
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true

docs/.eslintrc.json

@@ -0,0 +1,4 @@
+{
+  "extends": ["universe/node", "next/core-web-vitals"],
+	"root": true
+}

docs/.gitignore

@@ -0,0 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+.env

docs/.prettierrc

@@ -0,0 +1,3 @@
+{
+  "plugins": ["prettier-plugin-tailwindcss"]
+}

docs/README.md

@@ -1,160 +1,36 @@
-# Azure Translator Code
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
 
-The Azure Translator Code library is a powerful tool for translating JSON files into multiple languages using the Azure Cognitive Translator service. This library supports translation of JSON files in multiple folders or within a single folder, depending on your needs.
+## Getting Started
 
-[![npm version](https://badge.fury.io/js/azure-translator-code.svg)](https://badge.fury.io/js/azure-translator-code)
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![npm downloads](https://img.shields.io/npm/dm/azure-translator-code.svg?style=flat-square)](https://npm-stat.com/charts.html?package=azure-translator-code)
+First, run the development server:
 
-NPM PAGE: https://www.npmjs.com/package/azure-translator-code
-
-GITHUB PAGE: https://github.com/gabriel-logan/Azure-translator-code
-
-## Installation
-
-To get started, you can install the library via npm:
-
-As devDependencies
-```bash
-npm install -D azure-translator-code
-```
-
-You also can use yarn
-
-```bash
-yarn add -D azure-translator-code
-```
-
-or
-
-As dependencies
 ```bash
-npm install azure-translator-code
-```
-
-You also can use yarn
-
-```bash
-yarn add azure-translator-code
-```
-
-## Usage
-
-You can import the JSON file you want to translate in two different ways:
-
-### Importing a JSON File
-
-```javascript
-const jsonFile = require('./jsonFileToTranslate/en.json');
-
-// or
-
-// IMPORTANT
-// The file must follow this structure.
-const jsonFile = {
-  "translation": {
-    "welcome": "Welcome",
-    "hello": "Hello",
-  }
-};
-```
-
-Now, you can use the library to translate the JSON file into multiple languages:
-
-```javascript
-const { translateToMultipleFolders, translateToUnicFolder } = require('azure-translator-code');
-```
-or
-```javascript
-import { translateToMultipleFolders, translateToUnicFolder } from 'azure-translator-code';
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
 ```
 
-```javascript
-const key = 'sds12312a213aaaa9b2d0c37eds37b'; // REPLACE WITH YOUR OWN KEY HERE
-const endpoint = 'https://api.cognitive.microsofttranslator.com/';
-const location = 'eastus';
-const fromLang = 'en';
-const toLangs = [
-  'pt',
-  'de',
-  'es',
-  'fr',
-  'it',
-  'ja',
-  'ko',
-  'nl',
-  'ru',
-  'zh',
-  'pt-pt',
-  'ar',
-  'tlh-Latn'
-];
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-const jsonFile = {
-  "translation": {
-    "welcome": "Welcome",
-    "hello": "Hello"
-  }
-};
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
 
-// Translation to multiple folders
-translateToMultipleFolders(key, endpoint, location, fromLang, toLangs, jsonFile);
-// This function will return a folder called multiFolderGeneratedTranslations
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
 
-// Translation to a single folder
-translateToUnicFolder(key, endpoint, location, fromLang, toLangs, jsonFile);
-// This function will return a folder called unicFolderGeneratedTranslations
+## Learn More
 
-// Update translation from the multiple folders
-updateTranslationsMulti(key, endpoint, location, fromLang, toLangs, jsonFile);
-// This function will update the translations in the folder called multiFolderGeneratedTranslations
-```
-
-#### You can also choose the folder or folder name where you will save the files.
-##### Saving always starts from the project root folder.
-
-```javascript
-const { translateToMultipleFolders, translateToUnicFolder } = require('azure-translator-code');
-
-const key = 'sds12312a213aaaa9b2d0c37eds37b'; // REPLACE WITH YOUR OWN KEY HERE
-const endpoint = 'https://api.cognitive.microsofttranslator.com/';
-const location = 'eastus';
-const fromLang = 'en';
-const toLangs = ['pt', 'de'];
-
-const jsonFile = {
-  "translation": {
-    "welcome": "Welcome",
-    "hello": "Hello",
-  }
-};
+To learn more about Next.js, take a look at the following resources:
 
-// IMPORTANT: If you use '../../' it will try to save to a location before the root folder
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
 
-// Translation to multiple folders
-translateToMultipleFolders(key, endpoint, location, fromLang, toLangs, jsonFile, 'myFolder');
-// This function will return a folder called myFolder
-
-// Translation to a single folder
-translateToUnicFolder(key, endpoint, location, fromLang, toLangs, jsonFile, 'myFolder/OtherFolder/etc');
-// This function will return a folder called ./myFolder/OtherFolder/etc
-
-// Translation to a single folder
-translateToUnicFolder(key, endpoint, location, fromLang, toLangs, jsonFile, './myFolder/OtherFolder/etc');
-// This function will return a folder called ./myFolder/OtherFolder/etc
-
-// Update translation from the multiple folders
-updateTranslationsMulti(key, endpoint, location, fromLang, toLangs, jsonFile, 'myFolder');
-// This function will update the translations in the folder called myFolder
-```
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
 
-Make sure to replace the key and endpoint information with your own Azure access credentials. Ensure that the JSON file and settings are correctly defined according to your needs.
+## Deploy on Vercel
 
-Contributing
-If you wish to contribute to this project, feel free to open an issue or submit a pull request on our GitHub repository.
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
 
-<p align="center">
-	<a href="https://www.buymeacoffee.com/gabriellogan" target="_blank">
-		<img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 60px !important;width: 217px !important;" >
-	</a>
-</p>
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

docs/next.config.mjs

@@ -0,0 +1,10 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+	output: "export",
+	basePath:
+		process.env.NODE_ENV === "production"
+			? "/Azure-translator-code"
+			: undefined,
+};
+
+export default nextConfig;

docs/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "azure-translator-code",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "next": "14.2.3",
+    "react": "^18",
+    "react-dom": "^18"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "eslint": "^8.57.0",
+    "eslint-config-next": "14.2.3",
+    "eslint-config-universe": "^12.1.0",
+    "postcss": "^8",
+    "prettier": "^3.2.5",
+    "prettier-plugin-tailwindcss": "^0.5.14",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5"
+  }
+}

docs/postcss.config.mjs

@@ -0,0 +1,8 @@
+/** @type {import('postcss-load-config').Config} */
+const config = {
+  plugins: {
+    tailwindcss: {},
+  },
+};
+
+export default config;

docs/src/app/globals.css

@@ -0,0 +1,33 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --foreground-rgb: 0, 0, 0;
+  --background-start-rgb: 214, 219, 220;
+  --background-end-rgb: 255, 255, 255;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --foreground-rgb: 255, 255, 255;
+    --background-start-rgb: 0, 0, 0;
+    --background-end-rgb: 0, 0, 0;
+  }
+}
+
+body {
+  color: rgb(var(--foreground-rgb));
+  background: linear-gradient(
+      to bottom,
+      transparent,
+      rgb(var(--background-end-rgb))
+    )
+    rgb(var(--background-start-rgb));
+}
+
+@layer utilities {
+  .text-balance {
+    text-wrap: balance;
+  }
+}

docs/src/app/layout.tsx

@@ -0,0 +1,23 @@
+import type { Metadata } from "next";
+import { Inter } from "next/font/google";
+import "./globals.css";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export const metadata: Metadata = {
+	title: "Azure Translator Code",
+	description: "Generated by Azure Translator Code",
+	authors: { name: "Gabriel Logan" },
+};
+
+export default function RootLayout({
+	children,
+}: Readonly<{
+	children: React.ReactNode;
+}>) {
+	return (
+		<html lang="en">
+			<body className={inter.className}>{children}</body>
+		</html>
+	);
+}

docs/src/app/not-found.tsx

@@ -0,0 +1,28 @@
+import Link from "next/link";
+
+export default function NotFound() {
+	return (
+		<main className="min-h-screen">
+			<div className="mx-auto mt-32 max-w-md rounded bg-white p-5 text-center shadow-md">
+				<h1 className="text-3xl text-red-500">404 - Page not found</h1>
+				<p className="mt-5 text-lg text-black">
+					The page you are looking for does not exist. 😩😩😩
+				</p>
+				<div className="mt-5">
+					<Link
+						className="mx-2 inline-block rounded bg-blue-500 px-5 py-2 text-white transition-colors duration-300 hover:bg-blue-700"
+						href="https://gabriel-logan.github.io/Azure-translator-code/"
+					>
+						Back
+					</Link>
+					<Link
+						className="mx-2 inline-block rounded bg-blue-500 px-5 py-2 text-white transition-colors duration-300 hover:bg-blue-700"
+						href="https://github.com/gabriel-logan/Azure-translator-code"
+					>
+						Go to GitHub
+					</Link>
+				</div>
+			</div>
+		</main>
+	);
+}