Skip to content

Instantly share code, notes, and snippets.

Avatar
🏠
Working from home

Vanessa (Nkoyo) Ating missating

🏠
Working from home
View GitHub Profile
View index.html
<!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>TypeScript + React</title>
</head>
<body>
<div id="root">
View webpack.config.js
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: './src/index.tsx',
resolve: {
extensions: ['.ts', '.tsx', '.js']
},
output: {
View index.tsx
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import App from './components/App';
ReactDOM.render (
<App color="Blue" />,
document.getElementById("root")
);
View App.tsx
import * as React from 'react';
import PageInterface from '../PageInterface';
class App extends React.Component<PageInterface, {}> {
render() {
return (<div>
<h1>Welcome to React with Typescript</h1>
<p>The color of this page is: {this.props.color}</p>
</div>
View webpack.config.js
const path = require('path');
module.exports = {
entry: './src/index.tsx',
resolve: {
extensions: ['.ts', '.tsx', '.js']
},
output: {
path: path.join(__dirname, '/dist'),
filename: 'bundle.min.js'
View pageInterface.ts
export default interface Page {
color: string;
}
View tsconfig.json
{
"compilerOptions": {
"sourceMap": true,
"noImplicitAny": false,
"module": "commonjs",
"target": "es6",
"lib": [
"es2015",
"es2017",
"dom"
View webpack.config.js
const path = require('path');
module.exports = {
entry: './src/index.tsx',
output: {
path: path.join(__dirname, '/dist'),
filename: 'bundle.min.js'
}
}
@missating
missating / blog-routes.txt
Last active Jul 6, 2020
Blog routes table showing the 7 different route for my medium post Restful routes
View blog-routes.txt
| NAME | PATH | HTTP VERB | PURPOSE |
|----------|----------------|-----------------|--------------------------------------|
| Index | /blog | GET | Displays all blog post |
| New | /blog/new | GET | Shows new form for new blog entry |
| Create | /blog | POST | Creates a new blog post |
| Show | /blog/:id | GET | Shows one specified blog post |
| Edit | /blog/:id/edit | GET | Shows edit form for one blog post |
| Update | /blog/:id | PUT | Updates a particular blog post |
| Destroy | /blog/:id | DELETE | Deletes a particular blog post |