Ryan Allred Synvox

Build a JSX Renderer

Background

Writing HTML in JavaScript is a pain. In older applications a developer may use .innerHTML throughout the application to update the content of a webpage.

Here are some bad examples:

// Using jQuery:
$('<div>Hello World</div>').appendTo('body')

// Using JavaScript

	module.exports = {
	entry: './index.js',
	output: {
	filename: './bundle.js',
	path: '/'
	},
	module: {
	rules: [
	{
	test: /\.js?$/,

	const isWeb = window.location.href.indexOf('http') !== -1

	import 'whatwg-fetch'
	const feathers = require('feathers/client')
	const rest = require('feathers-rest/client')
	const hooks = require('feathers-hooks')
	const seedrandom = require('seedrandom')
	const insight = require('./insight')

	const app = feathers()

	const getEvents = (url='http://calendar.byui.edu/RSSFeeds.aspx?data=tq9cbc8b%2btuQeZGvCTEMSP%2bfv3SYIrjQ3VTAXA335bE0WtJCqYU4mp9MMtuSlz6MRZ4LbMUU%2fO4%3d')=>{
	return new Promise((resolve, reject)=>{
	fetch(url)
	.then(res=>res.text()).then(function(xml) {
	const doc = new DOMParser().parseFromString(xml, 'text/xml')
	const activities = []

	Array.prototype.slice.call(doc.getElementsByTagName('item')).forEach((item)=>{
	activities.push({
	title: item.querySelector('title').textContent,

	<main>
	<canvas></canvas>
	<h1>
	Ryan Allred
	<small>Full Stack Web Engineer</small>
	</h1>
	</main>

	// legacy Il2 scraping

	let il2 = (()=>{
	let host = 'https://byui.brainhoney.com',
	url = '/Frame/Component/Home',
	week = 604800000,
	now = Date.now()

	function timeStampToDate(dateString) {
	var dt = new Date();