Skip to content

Instantly share code, notes, and snippets.

View siakaramalegos's full-sized avatar
🦄

Sia siakaramalegos

🦄
368 followers · 91 following
View GitHub Profile
@siakaramalegos
siakaramalegos / .zshrc
Created February 17, 2016 13:57
# Path to your oh-my-zsh installation.
export ZSH=/Users/sia1/.oh-my-zsh
# Set name of the theme to load.
# Look in ~/.oh-my-zsh/themes/
# Optionally, if you set this to "random", it'll load a random theme each
# time that oh-my-zsh is loaded.
ZSH_THEME="robbyrussell"
# Uncomment the following line to use case-sensitive completion.
@siakaramalegos
siakaramalegos / index.html
Created June 12, 2016 00:37
react-getting-started-github
<div id="root"></div>
@siakaramalegos
siakaramalegos / index.html
Created June 12, 2016 15:01
react-getting-started-game
<div id="container" class="container"></div>
@siakaramalegos
siakaramalegos / index.html
Created July 25, 2016 01:45
Flexbox demo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>Header</header>
@siakaramalegos
siakaramalegos / Document.es6
Created October 6, 2016 20:48
Updating style based on button click in React
import React, {Component, PropTypes} from 'react'
import View from './View'
import Button from '../common/Button'
export default class Document extends Component {
static propTypes = {
program: PropTypes.object.isRequired,
}
constructor() {
@siakaramalegos
siakaramalegos / ControlledVsUncontrolledForms.js
Last active December 15, 2020 12:39
Controlled vs Uncontrolled/Serialized Forms in React
import React, {Component} from 'react'
import serialize from 'form-serialize'
export class FrontEndPartyControlled extends Component {
static defaultProps = {
name: '',
spiritAnimal: '',
}
constructor(props) {
@siakaramalegos
siakaramalegos / basic_router.jsx
Last active July 6, 2023 04:02
Basic example of React Router: BrowserRouter, Link, Route, and Switch
// BrowserRouter is the router implementation for HTML5 browsers (vs Native).
// Link is your replacement for anchor tags.
// Route is the conditionally shown component based on matching a path to a URL.
// Switch returns only the first matching route rather than all matching routes.
import {
BrowserRouter as Router,
Link,
Route,
Switch,
} from 'react-router-dom';
@siakaramalegos
siakaramalegos / BasicControlledForm.js
Last active October 26, 2017 20:47
Basic controlled inputs form
import React, { Component } from 'react'
export default class BasicControlledForm extends Component {
constructor() {
super()
// Initialize the values for our input properties with empty strings
this.state = {
firstName: '',
spiritAnimal: '',
}
@siakaramalegos
siakaramalegos / UncontrolledSerializedForm.js
Last active December 11, 2018 22:47
Basic uncontrolled inputs using form serialization to get data from form
import React, { Component } from 'react'
// Import the serialize function from the form-serialize package
import serialize from 'form-serialize'
export default class UncontrolledSerialized extends Component {
onSubmit = (e) => {
e.preventDefault()
// Usually, we would pass the final input values to a function that
// would do something with the data like persist it to a database.
// Using serialization, we just need to pass that function the
@siakaramalegos
siakaramalegos / UncontrolledRefForm.js
Created June 2, 2017 18:21
Basic uncontrolled inputs form using refs
import React, { Component } from 'react'
export default class UncontrolledRefsForm extends Component {
onSubmit = (e) => {
e.preventDefault()
// Usually, we would pass the final input values to a function that
// would do something with the data like persist it to a database.
// Using refs, we just need to pass the reference values.
console.log({
firstName: this.firstName.value,