{"id":1950,"date":"2021-11-01T19:15:55","date_gmt":"2021-11-01T23:15:55","guid":{"rendered":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/?p=1950"},"modified":"2021-11-01T20:29:40","modified_gmt":"2021-11-02T00:29:40","slug":"deploy-to-netlify-2","status":"publish","type":"post","link":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/topics\/jamstack\/eleventy\/deploy-to-netlify-2\/","title":{"rendered":"Deploy to Netlify"},"content":{"rendered":"\n<p>This post covers how to get your site in the web using Netlify&#8217;s servers.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Terminology<\/h2>\n\n\n\n<p>Some words you might not know<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><a rel=\"noreferrer noopener\" href=\"https:\/\/www.netlify.com\/\" target=\"_blank\">Netlify<\/a>: Netlify is a hosting platform specializing in hosting projects build with workflows like ours (static site generator and GitHub).<ul><li>They have a generous <a rel=\"noreferrer noopener\" href=\"https:\/\/www.netlify.com\/pricing\/\" target=\"_blank\">free pricing tier<\/a> that is great for the kind of personal projects we&#8217;re doing in class.<\/li><\/ul><\/li><li><strong>Deploy<\/strong>: This is the process of moving your files from your local dev environment (your computer and GitHub Repository) to a web site everyone in the world can see.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Steps to Deploy to Netlify<\/h2>\n\n\n\n<ol class=\"wp-block-list\"><li>Make sure you have a GitHub repository and have pushed your latest changes.<\/li><li>You will need to have a build script in your package.json. If you used my <a rel=\"noreferrer noopener\" href=\"https:\/\/github.com\/profstein\/eleventy-basic\" target=\"_blank\">eleventy basic template<\/a> then you have the script. It&#8217;s this line<ol><li>&#8220;build&#8221;: &#8220;npx @11ty\/eleventy&#8221;<\/li><\/ol><\/li><li><a rel=\"noreferrer noopener\" href=\"https:\/\/app.netlify.com\/signup\" target=\"_blank\">Sign up for Netlify<\/a> using your GitHub account<\/li><li>Click the &#8220;<strong>New site from Git<\/strong>&#8221; button<\/li><li>Select &#8220;<strong>Github<\/strong>&#8221; as your Git provider<\/li><li>Select your repository (<em>username\/my-eleventy-project<\/em>)<\/li><li>Check the following settings:<ol><li>Branch to deploy: main<\/li><li>Base Directory: leave this blank<\/li><li>Build Command: npm run build<\/li><li>Publish directory: public<\/li><\/ol><\/li><li>Click the &#8220;<strong>Deploy site<\/strong>&#8221; button<\/li><\/ol>\n\n\n\n<p>It will go to a new screen and show that your site deploy is in process. When it&#8217;s done you will see a check mark next to step 1 on that screen.<\/p>\n\n\n\n<p>If you get an error on your deploy, let me know and we&#8217;ll work through it.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Optional &#8211; Change your site name<\/h4>\n\n\n\n<p>by default your url will be something like https:\/\/wierd-words-12dsfdds.netlify.app You can change the front part so it is more like my-project.netlify.app.<\/p>\n\n\n\n<ol class=\"wp-block-list\" start=\"1\"><li>Click the &#8220;<strong>Site settings<\/strong>&#8221; button<\/li><li>Click the &#8220;<strong>Change site name<\/strong>&#8221; button<\/li><li>Enter the name you want (it will be the part before .netlify.app). <em>Remember that it can not have spaces in the name.<\/em><\/li><li>Click the &#8220;<strong>Save<\/strong>&#8221; button<\/li><\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Other Tutorials<\/h2>\n\n\n\n<p>Here are links to some other people going over Deploying to Netlify<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Netlify Tutorial \u2013 Deploying from Git\" width=\"750\" height=\"422\" src=\"https:\/\/www.youtube.com\/embed\/mN9oI98As_4?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n<\/div><figcaption>very quick video walkthrough by Netlify<\/figcaption><\/figure>\n\n\n\n<p>D<a href=\"https:\/\/11ty.recipes\/recipes\/deploy-an-eleventy-site-to-netlify\/\" target=\"_blank\" rel=\"noreferrer noopener\">eploy a Site to Netlify<\/a> by <a href=\"https:\/\/mikeaparicio.com\/\">Mike Aparicio<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This post covers how to get your site in the web using Netlify&#8217;s servers. Terminology Some words you might not know Netlify: Netlify is a hosting platform specializing in hosting projects build with workflows like ours (static site generator and GitHub). They have a generous free pricing tier that is great for the kind of&hellip; <a class=\"more-link\" href=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/topics\/jamstack\/eleventy\/deploy-to-netlify-2\/\">Continue reading <span class=\"screen-reader-text\">Deploy to Netlify<\/span><\/a><\/p>\n","protected":false},"author":16,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","portfolio_post_id":0,"portfolio_citation":"","portfolio_annotation":"","openlab_post_visibility":"","footnotes":""},"categories":[146,150],"tags":[154,156,157,155,33],"coauthors":[87],"class_list":["post-1950","post","type-post","status-publish","format-standard","hentry","category-eleventy","category-eleventy-site","tag-deploy","tag-hosting","tag-server","tag-site","tag-tutorial","entry"],"featured_image_urls_v2":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","1536x1536":"","2048x2048":"","post-thumbnail":"","gform-image-choice-sm":"","gform-image-choice-md":"","gform-image-choice-lg":""},"post_excerpt_stackable_v2":"<p>This post covers how to get your site in the web using Netlify&#8217;s servers. Terminology Some words you might not know Netlify: Netlify is a hosting platform specializing in hosting projects build with workflows like ours (static site generator and GitHub).They have a generous free pricing tier that is great for the kind of personal projects we&#8217;re doing in class.Deploy: This is the process of moving your files from your local dev environment (your computer and GitHub Repository) to a web site everyone in the world can see. Steps to Deploy to Netlify Make sure you have a GitHub repository&hellip;<\/p>\n","category_list_v2":"<a href=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/category\/topics\/jamstack\/eleventy\/\" rel=\"category tag\">Eleventy<\/a>, <a href=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/category\/projects\/eleventy-site\/\" rel=\"category tag\">Eleventy Site<\/a>","author_info_v2":{"name":"Christopher Stein","url":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/author\/cstein\/"},"comments_num_v2":"4 comments","uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"post-thumbnail":false,"gform-image-choice-sm":false,"gform-image-choice-md":false,"gform-image-choice-lg":false},"uagb_author_info":{"display_name":"Christopher Stein","author_link":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/author\/cstein\/"},"uagb_comment_info":4,"uagb_excerpt":"This post covers how to get your site in the web using Netlify&#8217;s servers. Terminology Some words you might not know Netlify: Netlify is a hosting platform specializing in hosting projects build with workflows like ours (static site generator and GitHub). They have a generous free pricing tier that is great for the kind of&hellip;&hellip;","_links":{"self":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/posts\/1950","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/comments?post=1950"}],"version-history":[{"count":4,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/posts\/1950\/revisions"}],"predecessor-version":[{"id":1958,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/posts\/1950\/revisions\/1958"}],"wp:attachment":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/media?parent=1950"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/categories?post=1950"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/tags?post=1950"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-fall-21\/wp-json\/wp\/v2\/coauthors?post=1950"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}