Got a good amount of the most important content in the project.
This commit is contained in:
commit
6f24f19897
11 changed files with 196 additions and 0 deletions
8
.babelrc
Normal file
8
.babelrc
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"plugins": [
|
||||
["@babel/plugin-transform-react-jsx", {
|
||||
"pragma": "h",
|
||||
"pragmaFrag": "Fragment",
|
||||
}]
|
||||
]
|
||||
}
|
||||
5
index.html
Normal file
5
index.html
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<html>
|
||||
<body style="margin : 0">
|
||||
<script src="./src/index.jsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
26
package.json
Normal file
26
package.json
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
{
|
||||
"name": "portfolio-site",
|
||||
"version": "1.0.0",
|
||||
"description": "Portfolio Site",
|
||||
"main": "src/index.jsx",
|
||||
"scripts": {
|
||||
"start": "parcel index.html"
|
||||
},
|
||||
"author": "",
|
||||
"license": "BSD-2-Clause",
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.12.3",
|
||||
"@babel/plugin-transform-react-jsx": "^7.12.1",
|
||||
"parcel-bundler": "^1.12.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^4.11.0",
|
||||
"preact": "^10.5.5"
|
||||
},
|
||||
"skipLibCheck": true,
|
||||
"alias": {
|
||||
"react": "preact/compat",
|
||||
"react-dom/test-utils": "preact/test-utils",
|
||||
"react-dom": "preact/compat"
|
||||
}
|
||||
}
|
||||
0
src/GameProjects.jsx
Normal file
0
src/GameProjects.jsx
Normal file
41
src/Greeting.jsx
Normal file
41
src/Greeting.jsx
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
import { h, render, Component } from "preact";
|
||||
import {
|
||||
Container,
|
||||
Card,
|
||||
CardActions,
|
||||
CardContent,
|
||||
Typography,
|
||||
Button,
|
||||
} from "@material-ui/core";
|
||||
import CV from "../static/cv.pdf";
|
||||
|
||||
class Greeting extends Component {
|
||||
render() {
|
||||
return (
|
||||
<Container maxWidth="sm">
|
||||
<p />
|
||||
<Card>
|
||||
<CardContent>
|
||||
<Typography variant="h1">Welcome</Typography>
|
||||
<Typography variant="body1">
|
||||
Hi, My name is Warwick and I'm a Fullstack Web Developer with an
|
||||
academeic background in Computing for Games and Entrepreneurship.
|
||||
</Typography>
|
||||
<Typography variant="subtitle1">Availability</Typography>
|
||||
<Typography variant="body2">
|
||||
I'm currently looking for work if you think my skills may be
|
||||
relevant to you. My CV and previous projects can be found below.
|
||||
</Typography>
|
||||
</CardContent>
|
||||
<CardActions>
|
||||
<Button href={CV} color="secondary">
|
||||
My Corriculum Vitae
|
||||
</Button>
|
||||
</CardActions>
|
||||
</Card>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Greeting;
|
||||
18
src/Header.jsx
Normal file
18
src/Header.jsx
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
import { h, render, Component } from "preact";
|
||||
import { AppBar, Toolbar, Container, Typography } from "@material-ui/core";
|
||||
|
||||
class Header extends Component {
|
||||
render() {
|
||||
return (
|
||||
<AppBar position="sticky">
|
||||
<Toolbar>
|
||||
<Container maxWidth="lg">
|
||||
<Typography>Warwick New</Typography>
|
||||
</Container>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Header;
|
||||
55
src/WebProjects.jsx
Normal file
55
src/WebProjects.jsx
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
import { h, render, Component } from "preact";
|
||||
import {
|
||||
Container,
|
||||
Card,
|
||||
CardHeader,
|
||||
CardMedia,
|
||||
CardActions,
|
||||
CardContent,
|
||||
Typography,
|
||||
Button,
|
||||
} from "@material-ui/core";
|
||||
import RambleScreenshot from "../static/images/RambleScreenshot.png";
|
||||
class WebProjects extends Component {
|
||||
render() {
|
||||
return (
|
||||
<Container>
|
||||
<p />
|
||||
<Typography variant="h4">Web Development Projects</Typography>
|
||||
<Card>
|
||||
<CardHeader
|
||||
title="ramble.fm"
|
||||
subheader="Ramble Media LTD - Fullstack Web Developer"
|
||||
/>
|
||||
<CardMedia
|
||||
style={{ height: 0, paddingTop: "25%" }}
|
||||
image={RambleScreenshot}
|
||||
title="ramble.fm"
|
||||
/>
|
||||
<CardContent>
|
||||
<Typography variant="body1">
|
||||
In this project I acted as CTO and built a website that allowed
|
||||
users to stream their podcasts live and accept call ins in a
|
||||
similar vain to talk shows! I learnt the entire javascript web
|
||||
development stack from react to audio streaming to devops in order
|
||||
to make it a reality.
|
||||
</Typography>
|
||||
</CardContent>
|
||||
<CardActions>
|
||||
<Button target="_blank" href="http://www.ramble.fm" color="primary">
|
||||
Learn More
|
||||
</Button>
|
||||
<Button
|
||||
target="_blank"
|
||||
href="http://beta.ramble.fm"
|
||||
color="secondary"
|
||||
>
|
||||
Try it!
|
||||
</Button>
|
||||
</CardActions>
|
||||
</Card>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default WebProjects;
|
||||
29
src/index.jsx
Normal file
29
src/index.jsx
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
import { h, render, Component } from "preact";
|
||||
import { Container, Grid, Button, Typography } from "@material-ui/core";
|
||||
import { ThemeProvider } from "@material-ui/core/styles";
|
||||
import theme from "./theme";
|
||||
import Header from "./Header";
|
||||
import Greeting from "./Greeting";
|
||||
import WebProjects from "./WebProjects";
|
||||
|
||||
class App extends Component {
|
||||
render() {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Header />
|
||||
<Greeting />
|
||||
<Container maxWidth="md">
|
||||
<WebProjects />
|
||||
<Typography variant="h1"> Hi </Typography>
|
||||
<Button color="primary">Hello, world!</Button>
|
||||
<Typography
|
||||
component="div"
|
||||
style={{ backgroundColor: "#cfe8fc", height: "100vh" }}
|
||||
/>
|
||||
</Container>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
render(<App />, document.body);
|
||||
14
src/theme.js
Normal file
14
src/theme.js
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
import { createMuiTheme } from "@material-ui/core/styles";
|
||||
import { orange, green, deepPurple } from "@material-ui/core/colors";
|
||||
|
||||
const theme = createMuiTheme({
|
||||
palette: {
|
||||
primary: green,
|
||||
secondary: deepPurple,
|
||||
},
|
||||
status: {
|
||||
danger: orange,
|
||||
},
|
||||
});
|
||||
|
||||
export default theme;
|
||||
BIN
static/cv.pdf
Normal file
BIN
static/cv.pdf
Normal file
Binary file not shown.
BIN
static/images/RambleScreenshot.png
Normal file
BIN
static/images/RambleScreenshot.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 144 KiB |
Loading…
Reference in a new issue