First version of setup.py generator.

Author: Bart Hazen

package.json

@@ -5,6 +5,7 @@
   "dependencies": {
     "@material-ui/core": "^4.9.8",
     "@material-ui/icons": "^4.9.1",
+    "@material-ui/lab": "^4.0.0-alpha.56",
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.5.0",
     "@testing-library/user-event": "^7.2.1",
@@ -13,8 +14,10 @@
     "node-sass": "^4.14.1",
     "prop-types": "^15.7.2",
     "react": "^16.13.1",
+    "react-copy-to-clipboard": "^5.0.2",
     "react-dom": "^16.13.1",
     "react-helmet": "^6.0.0",
+    "react-markdown": "^4.3.1",
     "react-router-dom": "^5.1.2",
     "react-scripts": "3.4.1",
     "react-syntax-highlighter": "^12.2.1",

public/manifest.json

@@ -0,0 +1,5 @@
+{
+    "short_name": "Python Create",
+    "name": "Python Create",
+    "description": "Python Create supports you in developing Python projects"
+}

src/App.js

@@ -5,8 +5,6 @@ import Routes from './routes';
 
 import { createBrowserHistory } from 'history';
 
-import './App.scss';
-
 const browserHistory = createBrowserHistory();
 
 function App() {

src/App.scss

@@ -1,11 +1,13 @@
 import React from "react";
 import ReactDOM from "react-dom";
 
-import "./index.scss";
 import App from "./App";
 
+import CssBaseline from '@material-ui/core/CssBaseline';
+
 ReactDOM.render(
   <React.StrictMode>
+    <CssBaseline />
     <App />
   </React.StrictMode>,
   document.getElementById('root')

src/components/Header/index.js

@@ -0,0 +1,8 @@
+# Welcome
+
+Python Create helps you in bringing your Python skills to the next level. This is just a starting point,
+where we'll introduce you our one and only super helpful generator for `setup.py` files.
+
+This website has been developed by Python-enthusiasts,
+lacking of serious web development skills,
+yet wanting to experiment a bit with React.

src/index.js

@@ -1,19 +1,34 @@
 import React from "react";
-import Header from "components/Header";
+import ReactMarkdown from 'react-markdown'
 
-import "./style.scss";
+import { Paper } from "@material-ui/core";
+import markdownSource from "pages/Homepage/Homepage.md"
 
 export default class Homepage extends React.Component {
+  constructor(props) {
+    super(props)
+
+    this.state = { markdown: null }
+  }
+
+  componentWillMount() {
+    fetch(markdownSource).then((response) => response.text()).then((text) => {
+      this.setState({ markdown: text })
+    })
+  }
+
   render() {
     return (
       <React.Fragment>
-        <Header
-          onDrawerToggle={this.props.handleDrawerToggle}
-          title="Python Create"
-        />
-
         <main className={this.props.classes.main}>
-          Homepage.
+          <Paper className={this.props.classes.paper}>
+            <div className={this.props.classes.contentWrapper}>
+              <ReactMarkdown
+                source={this.state.markdown}
+                escapeHtml={false}
+              />
+            </div>
+          </Paper>
         </main>
       </React.Fragment>
     );