Skip to content

Instantly share code, notes, and snippets.

View maisonm's full-sized avatar
🌴
On vacation (in my mind)

Maison Moa maisonm

🌴
On vacation (in my mind)
15 followers · 1 following
  • Florida
View GitHub Profile
@maisonm
maisonm / index.html
Created March 22, 2018 01:26
Flexbox Example Page - HTML
<!DOCTYPE html>
<html>
<head>
<title>Flexbox Example</title>
<link type="text/css" rel="stylesheet" href="styles.css">
<link href="https://fonts.googleapis.com/css?family=Rubik" rel="stylesheet">
</head>
<body>
<div class="container">
<div id="box1" class="box">#1</div>
@maisonm
maisonm / styles.css
Last active March 23, 2018 03:42
Flexbox Example - CSS
.container {
display: flex;
background: #1c9dc5;
font-family: 'Rubik', sans-serif;
}
.box {
border: solid #333 2px;
background: #a8a8a8;
height: 150px;
@maisonm
maisonm / Flexbox Example
Created March 22, 2018 01:47
.container {
display: flex;
}
@maisonm
maisonm / Flexbox Example
Last active March 23, 2018 03:26
.container {
display: flex;
background: #1c9dc5;
font-family: 'Rubik', sans-serif;
height: 200px;
}
@maisonm
maisonm / Flexbox Example
Last active March 23, 2018 03:36
.box {
border: solid #333 2px;
background: #a8a8a8;
width: 150px;
margin: 2px;
}
@maisonm
maisonm / Flexbox Example - styles.css
Last active March 23, 2018 03:54
.container {
display: flex;
background: #1c9dc5;
font-family: 'Rubik', sans-serif;
}
.box {
border: solid #333 2px;
background: #a8a8a8;
height: 150px;
@maisonm
maisonm / Flexbox Example
Last active March 30, 2018 14:48
.container {
display: flex;
flex-wrap: wrap;
background: #1c9dc5;
font-family: 'Rubik', sans-serif;
height: 350px;
width: 400px;
}
@maisonm
maisonm / Flexbox Example
Last active March 30, 2018 17:37
#box1 {
order: 2;
}
#box2{
order: 1;
}
#box3 {
order: 4;
}
#box4{
@maisonm
maisonm / server.js
Last active May 12, 2018 03:58
const express = require('express');
const app = express();
const port = process.env.PORT || 5000;
// console.log that your server is up and running
app.listen(port, () => console.log(`Listening on port ${port}`));
// create a GET route
app.get('/express_backend', (req, res) => {
res.send({ express: 'YOUR EXPRESS BACKEND IS CONNECTED TO REACT' });
@maisonm
maisonm / App.js
Last active May 12, 2018 05:15
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
class App extends Component {
state = {
data: null
};
componentDidMount() {