This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function nextRandomKana() { | |
const random = Math.floor(Math.random() * kana.length); | |
const newKana = kana[random]; | |
document.getElementById('romaji').innerText = newKana.en; | |
document.getElementById('h_tip').innerText = newKana.hiragana_info; | |
document.getElementById('k_tip').innerText = newKana.katakana_info; | |
document.getElementById('hiragana').innerText = newKana.hiragana; | |
document.getElementById('katakana').innerText = newKana.katakana; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Kana</title> | |
<link href="https://fonts.googleapis.com/css2?family=Sawarabi+Mincho&display=swap" rel="stylesheet"> | |
<link rel="stylesheet" href="style.css"> | |
</head> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const kana = [ | |
{ | |
"hiragana": "あ", | |
"katakana": "ア", | |
"en": "a", | |
"hiragana_info": "apple", | |
"katakana_info": "axe", | |
"original_kana_eng": "" | |
}, | |
{ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const { createServer } = require('https'); | |
const { parse } = require('url'); | |
const next = require('next'); | |
const fs = require('fs'); | |
const dev = process.env.NODE_ENV !== 'production'; | |
const app = next({ dev }); | |
const handle = app.getRequestHandler(); | |
const httpsOptions = { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import ReactDOM from 'react-dom'; | |
const App = () => ( | |
<div className="app"> | |
<h1>Hi from MyApp</h1> | |
</div> | |
); | |
ReactDOM.render(<App />, document.getElementById('app')); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | |
<title>MyApp</title> | |
</head> | |
<body> | |
<div id="app"></div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Show hidden characters
{ | |
"presets": [ | |
"@babel/preset-env", | |
"@babel/preset-react" | |
] | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const webpack = require('webpack'); | |
const HtmlWebpackPlugin = require('html-webpack-plugin'); | |
const CopyPlugin = require('copy-webpack-plugin'); | |
const path = require('path'); | |
module.exports = { | |
entry: './src/index.js', // default | |
output: { | |
path: path.resolve(__dirname, 'dist'), | |
filename: 'bundle.js' |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Webpack | |
npm i --save-dev webpack webpack-dev-server webpack-cli | |
npm i --save-dev copy-webpack-plugin | |
npm i --save-dev html-webpack-plugin | |
// Babel | |
npm i --save-dev @babel/core @babel/preset-env | |
npm i --save-dev babel-loader | |
npm i --save-dev @babel/preset-react |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mkdir myapp | |
cd myapp | |
npm init -y | |
mkdir src | |
mkdir dist | |
touch src/index.html | |
touch src/index.js | |
touch webpack.config.js |
NewerOlder