When was the last time you coded HTML/CSS/JS for fun?
CASCADE BOS will hold our third CSS Hack Night on Tuesday, April 26, 2016 at Bocoup!
Come with your laptop and open mind, and we'll have a "kata" challenge for you to geek out for fun.
Hack night will start 6 p.m., but feel free to drop in anytime after 6, have a pizza and drinks, plan to code for an hour (will go till about 8:30). We will have "code kata" challenge for you to solve. Code Kata is a great way to try out new Front End tricks or try creative solutions without real consequences. It is "learning by doing." To get an idea, see last two CSS Hack Night:
http://www.meetup.com/cascadebos/events/222806301/
http://www.meetup.com/cascadebos/events/219724592/
There will be subject matter experts and mentors to learn new things for developers/designers of all experience levels.
At the end, we post our creations on services like codepen, jsbin or github pages and we can have a quick lightning round of "show and tell" to share what people have created ad learn from each other!
There will be drinks and pizza courtesy of Insight Global, Thank you! https://www.insightglobal.net/
Please enter the building at 50 Utica St.
---
CASCADE BOS is a community for tech-minded designers and design-savvy developers. We aim to be a community where members can learn from each other about ever-changing front-end technology and web design trends. CASCADE BOS is run by volunteers.
Some feedback from the night, perhaps next css hack night will be a group effort, or live coding taking turns (5 min as people cheer on on the screen?) and have one thing to show at the end of the night? Something to think about and welcome your thoughts!
April 26
I wasn't really sure what effect I wanted to go for. Here's what I came up with in an hour:
http://codepen.io/lefauxfrog/pen/bpxQZX/
I borrowed heavily from this short and helpful article by Benoît Boucart.
http://blog.webbb.be/trigger-css-animation-scroll/
No plugins, just a bit of JavaScript that monitors the vertical scroll position of any element with a particular class. It uses animate.css to do something fancy as each one scrolls into view.
1 · April 26
This may be useful for github pages? https://github.com/daigofuji/html5-boilerplate-for-hackathon
April 26
Code Kata for April 2016 CASCADE BOS CSS Hack Night "Lyrical Experience"
Take a lyrics of Prince or David Bowie
http://www.azlyrics.com/p/prince.html
http://www.azlyrics.com/b/bowie.html
(or whatever artist you want) and semantically put each lines of the lyrics in p or span, then, wrap them in divs and give classes like "verse verse-1" "chorus" "bridge" etc, create a scroll based lyrics experience! Post it on places like:
http://codepen.io/
https://jsfiddle.net/
https://bl.ocks.org/-/about
https://pages.github.com/
And share on the comments section of this meetup!
April 26
I should mention that this is for ALL SKILL LEVELS! Especially good for beginners and people who have never been to hack-a-thon/hack day/coda-a-thon before. Bring a laptop! I have a good kata! Can't wait to see you all.
April 25
Meetup members, Log in
By clicking "Sign up" or "Sign up using Facebook", you confirm that you accept our Terms of Service & Privacy Policy
it's a start, still having a few issues on the scroll into view http://codepen.io/patneedham_/pen/vGzvLv