text: "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[937],{9880:function(t,o,e){e.r(o),e.d(o,{frontMatter:function(){return d},contentTitle:function(){return u},metadata:function(){return c},assets:function(){return s},toc:function(){return h},default:function(){return m}});var a=e(7462),r=e(3366),l=(e(7294),e(3905)),n=e(3138),i=["components"],d={title:"Introduction",hide_title:!0},u=void 0,c={unversionedId:"introduction",id:"introduction",title:"Introduction",description:"A collection of live apps and tutorials to help you learn Doodle. Play with the apps and check out their",source:"@site/docs/introduction.mdx",sourceDirName:".",slug:"/introduction",permalink:"/doodle-tutorials/docs/introduction",tags:[],version:"current",frontMatter:{title:"Introduction",hide_title:!0},sidebar:"tutorialSidebar",next:{title:"Calculator",permalink:"/doodle-tutorials/docs/calculator"}},s={},h=[{value:"Calculator",id:"calculator",level:3},{value:"TodoMVC",id:"todomvc",level:3},{value:"Photos",id:"photos",level:3},{value:"PhotoStream",id:"photostream",level:3}],p={toc:h};function m(t){var o=t.components,e=(0,r.Z)(t,i);return(0,l.kt)("wrapper",(0,a.Z)({},p,e,{components:o,mdxType:"MDXLayout"}),(0,l.kt)("p",null,"A collection of live apps and tutorials to help you learn ",(0,l.kt)("a",{parentName:"p",href:"https://nacular.github.io/doodle"},"Doodle"),". Play with the apps and check out their\nwalkthroughs and source code."),(0,l.kt)("h3",{id:"calculator"},(0,l.kt)("a",{parentName:"h3",href:"/doodle-tutorials/docs/calculator"},"Calculator")),(0,l.kt)(n.B,{functionName:"calculator",height:"500",mdxType:"DoodleCodeBlock"}),(0,l.kt)("h3",{id:"todomvc"},(0,l.kt)("a",{parentName:"h3",href:"/doodle-tutorials/docs/todo"},"TodoMVC")),(0,l.kt)(n.B,{functionName:"todo",height:"500",mdxType:"DoodleCodeBlock"}),(0,l.kt)("h3",{id:"photos"},(0,l.kt)("a",{parentName:"h3",href:"/doodle-tutorials/docs/photos"},"Photos")),(0,l.kt)(n.B,{functionName:"photos",height:"500",mdxType:"DoodleCodeBlock"}),(0,l.kt)("h3",{id:"photostream"},(0,l.kt)("a",{parentName:"h3",href:"/doodle-tutorials/docs/photostream"},"PhotoStream")),(0,l.kt)("div",{style:{textAlign:"center",margin:"3em 0"}},(0,l.kt)("video",{autoPlay:!0,loop:!0,muted:!0,playsInline:!0,width:"400px"},(0,l.kt)("source",{type:"video/mp4",src:"/doodle-tutorials/photo_stream_desktop.mov"}),(0,l.kt)("p",null,"Your browser does not support the video element."))))}m.isMDXComponent=!0}}]);