No description, website, or topics provided.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
__mocks__
public
src
styles
.babelrc
.editorconfig
.eslintrc.yml
.gitignore
.jshintrc
CODE_OF_CONDUCT.md
LICENSE
README.md
package-lock.json
package.json
postcss.config.js
webpack.config.js
webpack.loaders.js
webpack.production.config.js
yarn.lock

README.md

Justin's Code Presentation Tool

This is a react app I made for a short talk I gave on CSS preprocessors. See it live here: jbrown25.github.io/slideshow/ It's not very flexible, and is pretty much only good for presenting code.

Making Slides

The content for the slides is generated by slides.json, located:

/public/data/slides.json

The file is structured like this:

{
	"slides": [
		{
			"heading": "First Heading",
			"bullets": [
				"Here is a for loop",
				"in JavaScript",
				"third bulletpoint"
			],
			"code": {
				"type": "javascript",
				"content": "for(let i = 0; i < collection.lenght; i++) {\n   console.log('this value: ' + i);\n}"
			}
		},
		{
			"heading": "Second Heading",
			"bullets": [
				"More bullet points",
				"Bullet points are unlimited",
				"Heading and code are not required",
				"but there must be a bullets array in each slide",
				"or there will be an error."
			]
		},
		{
			"bullets": [
				"no more content"
			]
		}
	]
}

Each slide object may contain a heading, bullet points, and a code sample. Heading and code aren't required, but there must be at least an empty array of bullets in each slide object or an error will be thrown.

I don't have a complete list of what languages are supported for syntax highlighting.

Built using Simple React Webpack Babel Starter Kit

Commands are the same as the starter kit. Install dependencies:

npm install

Run locally:

npm start

Build:

npm run build

Syntax highlighting from highlight.js

I used some page transitions from Codrops

Also used an animation from Spinkit for the loader