jQuery Refresher

Who am I?

Treighton Mauldin

~5 years in web development
Technical Director @ Page Design Group
3-time instructor @ UCD Coding Bootcamp
Favorite Languages: JavaScript, php, Go

Twitter: @treighton1988 // GitHub: @treighton

What is jQuery?

What we are going to cover today

How to "query" the DOM
Making updates to the DOM
Creating Elements
Handling Events and adding interactivity
The 2nd coolest hero of the trojan war

DOM Query

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec metus justo. Aliquam erat volutpat.

Creating DOM

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec metus justo. Aliquam erat volutpat.

Some More Code...

Layout, Fetching JSON, and passing to Components

import React from 'react'
import Layout from '../components/Layout'
import Articles from '../components/Articles'
import fetch from 'isomorphic-unfetch'

const Index = (props) => {
        return (
            <Layout>
                <Articles posts={props.posts} />
            </Layout>
        )
    }


Index.getInitialProps = async function() {
    const res = await fetch('http://pagedev.dev/wp-json/wp/v2/posts')
    const data = await res.json()

    console.log(data)

    return {
        posts: data
    }
};

export default Index