,::,:.::,,.,.,.#########:,,.##+++;+++++++++####+######+#@#@@#####@@@@#
,,,,,.::,,.,.,.###@##@##:,,:'+++++++++++++++++###+#########@#####@@@@+
,,,,,.::,,.,.,.##@####@#':'++#++#++++#+++++++++##+#+##+++++@#+##@@@@@#
,,,,,.::...,.,.++#######''+++++##+######+#+#####+######+###+@+###@@@@#
,,,,,.:,...,...####++''+++++++###################+##########+####@@@##
,,,,,,:,..,,...++#++'+++########@@#@######@##########+'+#+####+++#@@##
,,,,,.:,,.,,...'+++++'++###########@@@@@@#@@#########+++++@@##++++@@##
,,,,,,:,,.,,'+'+++##+++#####@@@@###@@@@@@@@######@###++++##'#@'+++@@@#
,:++.,:,,.,,+++#++#++########@@#@@@@@@@@@@@@#########++'+++++#+++++@##
,''';,;.:.,,+######+###########@#@@@@@@@@@@@@@###@@##++++''''+'++++#+@
,'''',;,:.,;+#######@@###@@@#######@@@@#@@@@@#@@@#@###+++''+###++++##@
.'''',;.:.,'+##+####@+##@@@######@#@@@#@##@@@@@@@@@#+#++++##@++++++###
;''''';.:.,++#####@@#########@@######@##+#+#@@@@@@@####++++@#+++++++##
+''''':.,.;+######@#######@@@@@@@@@@####'#++#@@@@@@#@##++++'#+++++++##
''+''+:.,.'+###@####@#@#@@@@@@@#@@@###+++##''#@@@@#@@@###++##+++++++##
+'+'++'...++######@@#######@@@@@@#@++''###'''+##@@@@@######+++++++++#+
+++'++'..,++#####@##@#@####@#@@@##+'+';'+''';;+#@@@@@@#####+++++++####
+'++++';.'+##########@#+#@@@@@###'';;;''''';;;;+@@@@@@#####++++++#+##+
''++++'+.'#@#########@#++++#+++'';;;;;;;';;;;;;'#@@@@##@###++++++++#++
+++++++'.++@@######@#+''''+++'';;;;;;;;;;;;;;;;;+#@@@@#@@@##+++++++##+
+++++#++:+#@@@@@@@#++'';;;''';;;:;:::;:;;;;;;;;;'#@@@@#@@@##++++++###;
++++++++;+#@@@@@@#++'';;;;;;:::::::::::::;::;;;;'+@@@@@@@@##+++++++++.
+++'++++#+#@@@@@@#+'';;::::::::::::::::::;;;;;;;;'#@@@@@@@##++++++####
#+++#'++++###@@@@#'';;:::::::::::;:::;';'''''';;;'+@#@@@@@##+++++#@##`
++++++++++###@@@@+';;:::;'';;;;::::;;'++######+;;;+###@@@@@#++++#@###+
'++++++++#####@#@+';;;'+++#+++';;;;;+++#########;;'##@@@@@@#++####@##+
++++'+++###@@@@#@+''##########+';;;'++++++'';''++;'#@@@@@@@##+###@###+
+++''+++###@@@@##+'##+++++++#++';;;'+++++'';;'''+''#@@@@@@@#######@#@'
+#'+##++@@@@@@@##+++'';''''++++';;;''++++'''''';'';+@@@@@@@####++#####
######++#@@@@@@@@++''''+'''++++';:;'++#++'++'''';';'@@@@@@@@##########
#@#@@##+#@@@@@@@@+'''+''+++++#+';:;'+++#+#@#+#+'';;;#@@@@@@#@#########
+########@@@@@@@@';''+#+###'#++':::'''#+'###++'';;;;'@@@@@@@##########
###@@####@@@@@@@#';'++++###'+#'':::;'''+++''''';;;;;'@@@@@@@@#########
######+##@@@@@#@';;;;;''''''+'';:::;;''+++++'';;;;;;;#@@@@@@@@#######+
####+###@@@@@@@#;;:::;'''++''';;:,:;;;''''';;;;;:;;;;##@@@@@@####+###+
#####+##@@@@@@@+;;::::;;;;;;;;;;:::;;;;;;;;;;:::::;;;##@#@@@@@########
+#####+#@@###@@+;::::::::;;;;;;;:,:;;;;::;::::::::;;;###@#@@@@@@@@@@@#
#####+##@@#@@@@';:::::::::::;;;:,:::;;;;::::::::;;;;;#@####@@@@@@@@#@#
@###@###@@#@##@';::::::::::::;;:::::;;;::::::::::;;;;#############@@#'
@#@@####@@####@';;:::::::::;;::::::;;;;;;::::::::;;;'+#''########@###'
#@#@####@@####@';;:::;:::;;';:'';;;;';';;;;:::::;;;''##+'++@#####@@##+
#####+##@@#+###';;;;;;;;;;'';'++';;++;';;;;;;;;;;;;'''++''#@#####@@##+
#+###++#@@#+###';;;;;;;;;''''+#@'''##+';;;;;;;;;;;'''''++;#@#########+
++##+++##@@'+++';'';;;;''''''+++''+'+';;;;';;;;;;;''';'';;@##########+
+++#++++#@#''+++;''''''''';;''++++++'';;;;;;;'''''''+;';;;@##########+
+++#++++##@'';'+;''''''''';;'''+++++''';;';';;'''';;+';;;'@@@#########
++++++++#+#;;''+;'''''''''';;;''++'''';;''''';;;;'';+;';;#############
++++++++#;##;''+;;''''''+'';;;;;;;;;;;;;;'+'''';;;;'#;;;;##########+##
++++++++#:##';;';'''''''++++++++++++++++##'';'';';;'#';;##############
++++#+++#:+##''''''''';''+#+';''++'';''''''''';';;;'@#+#####+++#######
+++++++++,+##@#@+''''''''''''';';;'''';;;;''''';;';#@@@#####+++#######
+++++++++,+##@@@#';''''''''';'''''';;;;;;;''''';';'@@@@####;#++#######
+++++++++,+#@@@@@'''''''''''''++++'''';;;;''''''''+@@@@####'++#+######
+++++'+++,++@@@@@+''+'''''''''+++++'''';''''''''''#@@@@####@+++#######
'+'+#++++,++#@@@@@+''''''''''''++++'''''''''''++'+#@@@#####@++########
++++#++++,+++@@@@@#++'''+'''''''''';''''''''+++++#@@#########+########
'''++++++,++++@@@@@+++++++''''';';;;;''''''''+++++@#######@#++########
'''++++++,+++#+#@@##++++++''''''';';;;';''++++++#'@#########++########
+++++++++,+++##++##+###+#+''''''';'''''''+++#++#+'###########+#+######
+++++++++,+++##+++#'######+++++'''''+'++++#+++##'++##########+########
+++++++++,+++##++++'+########+++++++++##+###+##''++#########++########
+++++++++,+++++++++;'+############+++#########+';++######@##++########
+++++++++,+++##++++;'+######################+''';++#######@#++########
+'+++++++,++###++++;'+++#############@#####+''';;+##########++########
+'+++++++,++@@+++++;''+++#################+++'';;++#########++#######+
+++++++++,++##++++#;'''+++##############++'+';;;;++##########+#######+
+++++++++,+++###++#;''''+++++##++++++++'''''';;;;++#########+++#######
+++++++++,++++#+#+#;'''''++++++++++++''''''';;;;'++##########+########
++++#++++,+++###+';';'''''++++++++'''''''''';;;;'++########++++#######
++++#++++:+++##+;:;;;''''''+'++++'''''''''';;;;;'+######+###++########
++++#+++#:+++++;::;'''''''''''++'+'''''''';;;;;;;'+#+######;+++#######
1
____ __ __ __
2
/ __ \____ _/ /_ / /___ / / ____ _____ ____
3
/ /_/ / __ `/ __ \/ / __ \ / / / __ `/_ / / __ \
4
/ ____/ /_/ / /_/ / / /_/ / / /___/ /_/ / / /_/ /_/ /
5
/_/ \__,_/_.___/_/\____/ /_____/\__,_/ /___/\____/
6
Software Developer
7
NORMAL
[No Name]
utf-8[unix]
7/187
$ cat ./skills/languages.txt
javascript, python

$ cat ./skills/frontend.txt
react, vue, backbone
webpack, jest, eslint plugins

$ cat ./skills/backend.txt
node.js, express, graphql, mongodb, flask
docker, aws-lambda

$ find ./projects -type f -exec open {} \;

react
graphql
apollo
styled-components
javascript

This Portfolio

My goal with this project was to revamp my porfolio and to put in practice what I have learned in the past few years.

It is a server rendered React application that is completely usable on the initial html render. It also works with scripts disabled.

The applicatio pulls all my public repos from GitHub's graphql API. It looks for PORTFOLIO.md in the master branch, and fallbacks to README.md or the name and description fields.

While more work upfront, making this a reflection of my github repositories allows me to forget about it and it will stay up to date with my latest projects.

react
aphrodite
stackoverflow
javascript

Stack Attack

Try to guess the accepted answer for a random stack overflow question.
Uses Stack Overflow's public API to fetch questions and answers.
See it in action here.

javascript
cssinjs
jest
rollup

ezpz

I started working on this to learn how to release an npm package.
I'm no longer developing this, as I realized this adds unnecessary complexity to small projects, and is not flexible enough for bigger ones.

all modules come with a default value scale, rem is the preferred unit

if you pass in a number it will compute from the scale, if you pass in a string it will use it as-is:
padding(2) => padding: .5rem
padding('123px') => padding: 123px

Examples:

padding(1)

padding: .25rem;

padding.horizontal(1)

padding-left: .25rem;
padding-right: .25rem;

borderRadius(1)

border-radius: .125rem;

borderRadius(1).topLeft(0)

border-radius: .125rem;
border-radius-top-left: 0;
react
react-native
redux
sudoku
javascript

sudoku

React Native sudoku app. Uses Redux to manage state.

  2 3   4 5 6   7 8 9   
4 5 6   7 8 9   1 2     
7 8 9   1   3   4 5 6   

2 3       6 7   8 9 1   
5 6 7   8 9 1   2 3 4   
8 9 1   2 3 4   5   7   

3 4 5   6 7       1 2   
6   8   9 1 2   3 4 5   
9 1 2   3 4 5   6 7 8   
python
googleappengine

Old Portfolio

My old portfolio from 2015.
A Google App Engine application written in Python.
There is a little control panel to manage projects.
Projects are stored on Google Datastore.

javascript
react
server-side-rendering

React Static Content

Sometimes we have large pieces of static content in our application state, such as articles, user comments, or most content coming from a CMS.
Traditionally when server-side rendering, the initial HTML has two copies of this content, one in the markup and one in a script tag for rehydration.
This is a proof of concept for a way to rehydrate static content in the client without having the state needed to render it.

//server
ReactDOMServer.renderToString(
    <StaticRenderProvider server>
        <StaticContent renderID="big-table">
            <Table data={giantDataObject} />
        </StaticContent>
    </StaticRenderProvider>
);

//client
ReactDOM.rehydrate(
    <StaticRenderProvider>
        <StaticContent renderID="big-table">
            <Table data={null} />
        </StaticContent>
    </StaticRenderProvider>,
    document.getElementById('root'),
);
react
game
javascript

USN React Presentation

A little React word game app I coded for a live demo at work.

python
javascript
googleappengine

Hearth Arcade

Web Hearthstone UI that allows hundreds of players to control a single hearthstone game.
Uses Pusher to deliver board states to clients.

The biggest challenge was making the voting system scale to hundreds of simultaneous users. My solution was sharded counters on the Google Datastore.

serverless
aws-lambda
rollup
babel
automation

Garden API

A simple AWS Serverless API for an automated garden. Uses Rollup for bundling and transpiling.

scraping
python
captcha

Web Scraping Sample

A script and tools to scrape a whole country's population data from a web service and put them in a database.
Threaded to make the ~19 million records faster to download.
Separate script to verify downloaded records and a small Flask app to view the data.

python

PDF Batch Downloader and Converter

Simple Python script to batch download large amounts of PDF files and convert them to a usable image format.

built with ☕ by Pablo Lazo