-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
93 lines (87 loc) · 15.9 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<!DOCTYPE html> <html> <head> <meta charset=utf-8> <meta http-equiv=x-ua-compatible content="ie=edge,chrome=1"> <meta name=viewport content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>64 Bites - Short and Sweet Commodore 64 Programming Screencasts</title> <meta name=description content="The easiest way to start programming Commodore 64"> <link href="assets/stylesheets/application.css" rel=stylesheet /> <link rel=canonical href="http://64bites.com/"> <link href="assets/images/favicon.ico" rel=icon type="image/ico"/> <link rel=apple-touch-icon href="favicon-76.png"> <link rel=apple-touch-icon sizes=120x120 href:"favicon-120.png"> <link rel=apple-touch-icon sizes=152x152 href="favicon-152.png"> <link rel=apple-touch-icon sizes=180x180 href="favicon-180.png"> <meta name="twitter:card" content=summary_large_image> <meta name="twitter:site" content="@64_bites"> <meta name="twitter:creator" content="@mehowte"> <meta property="og:image" content="http://64bites.com/assets/images/episodes/014.png"> <meta property="og:locale" content=en_US> <meta property="og:url" content="http://64bites.com/"> <meta property="og:title" content="64 Bites - Short and Sweet Commodore 64 Programming Screencasts"> <meta property="og:type" content=website> <meta property="og:description" content="The easiest way to start programming Commodore 64"> <meta name=google-site-verification content=Yaz0CxBUbKaWP3BWbjlc_JEq0LhifBVnTBzYuXtYQBE> <meta name=coverage content=Worldwide> <link rel=stylesheet href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.2/jquery.fancybox.min.css" media=screen /> <style>
.embed-container {
position: relative;
padding-bottom: 62.25%;
height: 0;
overflow: hidden;
max-width: 100%;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.fancybox-slide--iframe .fancybox-content{
margin: 0!important;
max-width: 80%;
width: 80%;
padding-top: 50%;
height: 0 !important;
}
.fancybox-slide--iframe .fancybox-iframe{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: black;
}
} </style> <script>
!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
document,'script','https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '722589087875219');
fbq('track', 'PageView');
</script> <noscript><img height=1 width=1 style="display:none" src="https://www.facebook.com/tr?id=722589087875219&ev=PageView&noscript=1"/></noscript> </head> <body class=index> <header class=header> <div class=row> <a class=header__logo href="/"></a> <div class=navigation-bar> <ul> <li><a class="" href="/seasons/all">Seasons</a></li> <li><a class="" href="/episodes/all">Episodes</a></li> <li><a class="" href="/blog">Blog</a></li> <li><a class="" href="https://www.facebook.com/groups/64bitesVIP">Forums</a></li> <li><a class="" href="/64spec">Open Source</a></li> </ul> </div> </div> </header> <main> <section class=pitch> <div class=row> <h1 style="width: 100%">The easiest way to start programming <em>Commodore 64</em></h1> <p class=lead>Life is too short to read twenty-year-old books.<br><em>Learn</em> BASIC and 6502 Assembly with bite-sized video tutorials <em>today</em>!</p> </div> </section> <section> <div class=row> <h2 class="u-margin-top-large u-centered-text">Let me guess, You Love Commodore 64</h2> <p class=lead>You've always wanted to either create a C64 game or a demo,<br>or at least figure out how they are made.</p> <p>But it's not that easy. If you start from scratch, you need to learn <strong>BASIC</strong> and <strong>assembly</strong>, figure out how to put <strong>sprites</strong> on the screen, use graphical modes, <strong>play SID music</strong> or handle joystick.</p> <p>If you already know all of that, you might be curious about <strong>opening borders</strong>, displaying more than eight sprites, stabilizing <strong>raster interrupts</strong> and dealing with those pesky <strong>BAD LINES</strong>.</p> <p>The good news is, you can find a lot of old books about programming C64. You can even learn by reading source code of released demos.</p> <h2 class="u-margin-top-large u-centered-text">If only you had time for that...</h2> <p>Ok, let's see where this path might lead you.</p> <p>Finding books, reading them, realizing they are not always correct, searching for articles, reading source code, asking for help on forums...</p> <p>It is <strong>tedious</strong>.</p> <p>It is <strong>frustrating</strong>.</p> <p>It <strong>takes ages</strong>.</p> <p>Instead of a hobby you'll get another full-time job.</p><p>It's just not fun anymore, and your family doesn't enjoy it either.</p> <p>They secretly conspire to get rid of this "OLD CRAPPY COMPUTER" of yours.</p> <p>But what if I told you...</p> <h2 class="u-margin-top-large u-centered-text">There is a better way</h2> <p>Imagine someone doing all that hard work so you don't have to.</p> <p>Imagine watching a short video that you can easily fit it in your schedule.</p> <p>It takes only five minutes, but it teaches you just enough to push you toward your goal.</p> <p>Later you can get back to it. Read the source code and follow along in your own pace.</p> <p>Sounds too good to be true?</p> </row> </section> <div class=row> <h2 class="u-margin-top-large u-centered-text">Why don't you see for yourself?</h2> <p>Watch <strong>any</strong> of those videos <strong>now</strong> and learn something new in the next five minutes!</p> <br> </div> <section class="featured-episodes featured-3"> <div class=row> <div class=col-1-of-3> <div class=featured-episode> <h4>#031 - Using the SpritePad</h4> <a data-fancybox data-type=iframe data-src="https://player.vimeo.com/video/295661559" href="javascript:;"> <img class=thumbnail src="assets/images/episodes/031.png"/> <div class=featured-episode__play-button></div> </a> </div> </div> <div class=col-1-of-3> <div class="featured-episode featured-episode--best-one"> <h4>#051 - Hi-Res Bitmap Mode</h4> <a data-fancybox data-type=iframe data-src="https://player.vimeo.com/video/296269668" href="javascript:;"> <img class=thumbnail src="assets/images/episodes/051.png"/> <div class=featured-episode__play-button></div> </a> </div> </div> <div class=col-1-of-3> <div class=featured-episode> <h4>#014 - TDD with Macros</h4> <a data-fancybox data-type=iframe data-src="https://player.vimeo.com/video/296209065" href="javascript:;"> <img class=thumbnail src="assets/images/episodes/014.png"/> <div class=featured-episode__play-button></div> </a> </div> </div> </div> </section> <section> <div class=row> <h2 class="u-margin-top-large u-centered-text">That's not all</h2> <p>Watching a video is just a part of the fun. Each of those comes with:</p> <ul class=pros> <li><strong>complete transcript</strong> so that you won't miss a single word,</li> <li><strong>full source code</strong> that you can modify on your own and</li> <li><strong>programming exercises</strong> to make sure you completely understand the topic.</li> </ul> <p>You can <strong>watch them online</strong> on any device or <strong>download</strong> for your convenience <strong>DRM free</strong>.</p> <p>There are already 104 short, <strong>~5-minute-videos</strong> covering a small bit of <strong>BASIC</strong>, <strong>6502/6510 assembly</strong> and the architecture of Commodore 64.</p> </div> </section> <section class=first-season> <div class=row> <h2 class="u-margin-top-large u-centered-text">Get started with the first set of videos</h2> <p>Below, you will find a package of first nine episodes. It will put you on the right track.</p> <p>First six videos will tell you how to set up your tools, start programming in <strong>BASIC</strong>, and show you how to draw low-resolution graphics on the screen using <strong>FOR loops, READ, DATA, PEEK & POKE</strong>.</p> <p>The last three episodes of this season are a gentle introduction to <strong>assembly</strong>. Which will be used for the most part of the series later on.</p> <div class=season id=season-1> <a href="/seasons/001-from-basic-to-assembly"> <img class=season__poster src="assets/images/seasons/001.jpg"/> </a> <section class=buy> <div class=row> <div class=buy-button> <a class=button data-gumroad-single-product="" href="https://gumroad.com/l/64bites-season1/?wanted=true">Buy Season 1 for just $19.99</a> <p>Includes <strong>9 videos</strong>, <strong>detailed transcripts</strong>, <strong>source code examples</strong> and <strong>exercises</strong>.</p> </div> </div> </section> </div> </div> </section> <section class=testimonials> <h2>See what others are saying!</h2> <div class=row> <div class=col-1-of-2> <div class=testimonial> <div class=" bubble"> <blockquote>I learned assembly the hard way, with only limited documentation. Although part of the fun is in discovering all these things yourself, I think such screencasts could have helped me in getting up to speed faster. They do contain some nice bits of information :)</blockquote> </div> <div class=author> <img class=avatar src="assets/images/testimonials/paul-koller.jpg"/> <div class=credentials> <h4>- Paul Koller</h4> <p>Game Developer, Creator of C64anabalt, Super Bread Box and Micro Hexagon</p> </div> </div> </div> </div> <div class=col-1-of-2> <div class=testimonial> <div class=" bubble"> <blockquote>64bites brings me closer to understanding a computer I learned to love long ago, and still do. More than anything, it is really fun to follow the lessons and I always look forward to the next episode with great anticipation. It is the best thing since chocolate.</blockquote> </div> <div class=author> <img class=avatar src="assets/images/testimonials/sebastian-kostka.jpg"/> <div class=credentials> <h4>- Sebastian Kostka</h4> <p>Online Marketing Wizard at MeMyselfAndUs</p> </div> </div> </div> </div> </div> <div class=row> <div class=col-1-of-2> <div class=testimonial> <div class=" bubble"> <blockquote>I enjoyed both narration and realisation.<br>Actually, I was really shocked to have so much fun watching a programming screencast!</blockquote> </div> <div class=author> <img class=avatar src="assets/images/testimonials/robert-lapinski.jpg"/> <div class=credentials> <h4>- Robert Lapinski</h4> <p>CEO of Idea Head, Mastermind behind the Pixel Magazine</p> </div> </div> </div> </div> <div class=col-1-of-2> <div class=testimonial> <div class=" bubble"> <blockquote>How much time did you spend playing games on your Commodore c64? 64bites is more than 8-bit childhood memories, its a way to keep your beloved C64 alive, let's make our own game with it.</blockquote> </div> <div class=author> <img class=avatar src="assets/images/testimonials/andrzej-sliwa.jpg"/> <div class=credentials> <h4>- Andrzej Śliwa</h4> <p>Polyglot Programmer, Lead Developer at bonusbox GmbH</p> </div> </div> </div> </div> </div> <div class=row> <div class=col-1-of-2> <div class=testimonial> <div class=" bubble"> <blockquote>This is really cool. I don't know exactly how popular it will end up being, but there is always room online for things like this.</blockquote> </div> <div class=author> <img class=avatar src="assets/images/testimonials/peter-cooper.jpg"/> <div class=credentials> <h4>- Peter Cooper</h4> <p>Founder at Cooper Press, Chair of O'Reilly Fluent Conference</p> </div> </div> </div> </div> <div class=col-1-of-2> <div class=testimonial> <div class=" bubble"> <blockquote>Having watched a few episodes, I reiterate my original position: sooooooo coool. And Michal have really done a top-notch job on writing, production, audio, everything.</blockquote> </div> <div class=author> <img class=avatar src="assets/images/testimonials/avdi-grimm.jpg"/> <div class=credentials> <h4>- Avdi Grimm</h4> <p>Creator of the best selling programming screencast series - RubyTapas</p> </div> </div> </div> </div> </div> </section> <section class=newsletter> <div class=row> <h2>Want to try it out for free?</h2> <p class=lead>I can send you free videos and articles on programming Commodore 64 from time to time.</p> <a href="https://www.getdrip.com/forms/18339237/submissions/new" data-drip-show-form=18339237 class="show-newsletter-subscription button">Sounds Good!</a> </div> </section> </main> <footer class=footer> <span> Copyright © 2014-2019 Creative Mind - Michal Taszycki </span> </footer> <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script><script src="assets/javascripts/application.js"></script><script src="assets/javascripts/flipclock.js"></script><script src="assets/javascripts/moment-with-locales.js"></script><script src="assets/javascripts/moment-timezone-with-data-2012-2022.js"></script> <script>
!function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","page","once","off","on"];analytics.factory=function(t){return function(){var e=Array.prototype.slice.call(arguments);e.unshift(t);analytics.push(e);return analytics}};for(var t=0;t<analytics.methods.length;t++){var e=analytics.methods[t];analytics[e]=analytics.factory(e)}analytics.load=function(t){var e=document.createElement("script");e.type="text/javascript";e.async=!0;e.src=("https:"===document.location.protocol?"https://":"http://")+"cdn.segment.com/analytics.js/v1/"+t+"/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)};analytics.SNIPPET_VERSION="3.1.0";
analytics.load("3z8xJ01MQLwMsgpwWuPmw2BTxor55hoB");
analytics.page()
}}();
</script> <script src="//platform.twitter.com/oct.js"></script> <script>twttr.conversion.trackPid('nthnq', { tw_sale_amount: '0', tw_order_quantity: '0' });</script> <noscript> <img height=1 width=1 style="display:none;" alt="" src="https://analytics.twitter.com/i/adsct?txn_id=nthnq&p_id=Twitter&tw_sale_amount=0&tw_order_quantity=0"/> <img height=1 width=1 style="display:none;" alt="" src="//t.co/i/adsct?txn_id=nthnq&p_id=Twitter&tw_sale_amount=0&tw_order_quantity=0"/> </noscript> <script>
var _dcq = _dcq || [];
var _dcs = _dcs || {};
_dcs.account = '8833932';
(function() {
var dc = document.createElement('script');
dc.type = 'text/javascript'; dc.async = true;
dc.src = '//tag.getdrip.com/8833932.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(dc, s);
})();
</script> <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.2/jquery.fancybox.min.js"></script> <script src="https://gumroad.com/js/gumroad.js"></script> <script>
$("body").on("click", ".show-newsletter-subscription", function(e) {
e.preventDefault();
e.stopPropagation();
var formId = $(this).data("drip-show-form")
console.log(formId);
_dcq.push(["showForm", { id:formId }]);
});
</script> <script>
$(function() {
var $clock = $("#flipclock");
var timezone = "Europe/Warsaw";
var deadline = "2019-12-06 23:59:00";
var clientTimezone = moment.tz.guess();
var currentDate = moment.tz(moment(), clientTimezone);
var futureDate = moment.tz(deadline, timezone);
var secondsLeft = Math.round(Math.max(futureDate-currentDate, 0) / 1000);
var daysLeft = Math.floor(secondsLeft / (60*60*24));
var isDaily = daysLeft >= 1;
var width = isDaily ? "460px" : "340px";
$clock.width(width);
var clock = $clock.FlipClock(secondsLeft, {
clockFace: isDaily ? 'DailyCounter' : 'HourlyCounter',
countdown: true
});
var clock = $clock.FlipClock(deadline.diff(now, "seconds"),{
countdown: true,
clockFace: 'DailyCounter',
});
});
</script> </body> </html>