{"id":3328,"date":"2024-04-02T16:51:44","date_gmt":"2024-04-02T20:51:44","guid":{"rendered":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/?p=3328"},"modified":"2024-04-02T18:48:49","modified_gmt":"2024-04-02T22:48:49","slug":"deploy-to-netlify","status":"publish","type":"post","link":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/deploy-to-netlify\/","title":{"rendered":"Deploy to Netlify"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">This post covers how to get your site in the web using Netlify\u2019s servers.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">TERMINOLOGY<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Some words you might not know<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/www.netlify.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Netlify<\/a>: Netlify is a hosting platform specializing in hosting projects build with workflows like ours (static site generator and GitHub).\n<ul class=\"wp-block-list\">\n<li>They have a generous\u00a0<a href=\"https:\/\/www.netlify.com\/pricing\/\" target=\"_blank\" rel=\"noreferrer noopener\">free pricing tier<\/a>\u00a0that is great for the kind of personal projects we\u2019re doing in class.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<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>\n<\/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\">\n<li><strong>Before you start<\/strong>\u00a0make sure:\n<ul class=\"wp-block-list\">\n<li>Setup your\u00a0<a href=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/projects\/eleventy-site\/eleventy-personal-project-setup\/\">GitHub repository through Classroom<\/a><\/li>\n\n\n\n<li>AND\u00a0<strong>Accepted Membership in our Organization\u00a0<\/strong>(more info on above link).<\/li>\n\n\n\n<li>Have pushed your latest changes to GitHub (no changes showing as uncommitted in Codespace or local dev environment).<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><a href=\"https:\/\/app.netlify.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Sign up for Netlify<\/a>\u00a0using your GitHub account<\/li>\n\n\n\n<li>After you complete your info it should ask you to\u00a0<strong>Deploy your first project<\/strong>. Click on\u00a0<strong>Import from Git<\/strong>\n<ul class=\"wp-block-list\">\n<li><img loading=\"lazy\" decoding=\"async\" width=\"1934\" height=\"1532\" srcset=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart.png 1934w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart-300x238.png 300w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart-1024x811.png 1024w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart-768x608.png 768w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart-1536x1217.png 1536w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart-1568x1242.png 1568w\" src=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/httpsapp.netlify.comsignupstart.png\" alt=\"\"><\/li>\n\n\n\n<li>If you don\u2019t see that and are on the Netlify start Page Click the \u201c<strong>New site from Git<\/strong>\u201d button<\/li>\n\n\n\n<li>If you don&#8217;t see that either click Sites > Add New Site > Import Existing Project<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Select \u201c<strong>Deploy with GitHub<\/strong>\u201d button\n<ul class=\"wp-block-list\">\n<li><img loading=\"lazy\" decoding=\"async\" width=\"350\" height=\"133\" class=\"wp-image-3332\" style=\"width: 350px;\" src=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-content\/uploads\/sites\/3596\/2024\/04\/netlify-deploy-with-github-button.png\" alt=\"screenshot of step 1 of netlify Deploy with Deploy with GitHub button circled.\" srcset=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-content\/uploads\/sites\/3596\/2024\/04\/netlify-deploy-with-github-button.png 1716w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-content\/uploads\/sites\/3596\/2024\/04\/netlify-deploy-with-github-button-300x114.png 300w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-content\/uploads\/sites\/3596\/2024\/04\/netlify-deploy-with-github-button-1024x388.png 1024w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-content\/uploads\/sites\/3596\/2024\/04\/netlify-deploy-with-github-button-768x291.png 768w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-content\/uploads\/sites\/3596\/2024\/04\/netlify-deploy-with-github-button-1536x582.png 1536w\" sizes=\"auto, (max-width: 350px) 100vw, 350px\" \/><\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Authorize Netlify on Github (you should be taken there automatically)<\/li>\n\n\n\n<li>Select your <strong>Portfolio<\/strong> repository on stein-bmcc\n<ul class=\"wp-block-list\">\n<li>Change to the Stein-BMCC organization. <strong>If you didn\u2019t accept membership before on GitHub then this won\u2019t be visible<\/strong><\/li>\n\n\n\n<li><img loading=\"lazy\" decoding=\"async\" width=\"1666\" height=\"1010\" srcset=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC.png 1666w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC-300x182.png 300w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC-1024x621.png 1024w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC-768x466.png 768w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC-1536x931.png 1536w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC-1568x951.png 1568w\" src=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Choose-Stein-BMCC.png\" alt=\"netlify import: choose stein-bmcc option\"><\/li>\n\n\n\n<li>Type in your GitHub username in the\u00a0<strong>Search Repos\u00a0<\/strong>box and\u00a0<strong>press return\/enter key<\/strong><\/li>\n\n\n\n<li>Select your\u00a0<strong>eleventy-personal-site<\/strong>\u00a0(note you won\u2019t see this if you didn\u2019t start the site in GitHub Classroom.<\/li>\n\n\n\n<li><img loading=\"lazy\" decoding=\"async\" width=\"1464\" height=\"844\" srcset=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Find-11ty-site.png 1464w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Find-11ty-site-300x173.png 300w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Find-11ty-site-1024x590.png 1024w, https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Find-11ty-site-768x443.png 768w\" src=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Netlify-Find-11ty-site.png\" alt=\"type github username in repo search box and select your eleventy personal site.\"><\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Change the Publish Directory to Dist. Settings should look as follows (things in bold MUST be entered exactly):\n<ol class=\"wp-block-list\">\n<li>Site Name: Choose a name for your site. This has to be unique for ALL Netlify users so it may take a few tries. If you don&#8217;t put anything here then a random name will be chosen for you.\n<ul class=\"wp-block-list\">\n<li>It will end up being https:\/\/sitename.netlify.app<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Branch to deploy: <strong>main<\/strong><\/li>\n\n\n\n<li>Base Directory:\u00a0<em>leave this blank<\/em><\/li>\n\n\n\n<li>Build Command: <strong>npm run build<\/strong><\/li>\n\n\n\n<li>Publish directory:\u00a0<strong>_site<\/strong><\/li>\n<\/ol>\n<\/li>\n\n\n\n<li>Click the \u201c<strong>Deploy<\/strong>\u201d button<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">It will go to a new screen and show that your site deploy is in process. When it\u2019s done you will see a check mark next to step 1 on that screen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you get an error on your deploy, let me know and we\u2019ll work through it.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>You may have to refresh your screen if nothing changes in a couple of minutes.<\/strong><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Optional \u2013 Change your site name<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">If you did not select a site name above, then your 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\">\n<li>Click the \u201c<strong>Site settings<\/strong>\u201d button<\/li>\n\n\n\n<li>Click the \u201c<strong>Change site name<\/strong>\u201d button<\/li>\n\n\n\n<li>Enter the name you want (it will be the part before .netlify.app).\u00a0<em>Remember that it can not have spaces in the name.<\/em><\/li>\n\n\n\n<li>Click the \u201c<strong>Save<\/strong>\u201d button<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\"><\/h2>\n","protected":false},"excerpt":{"rendered":"<p>This post covers how to get your site in the web using Netlify\u2019s servers. TERMINOLOGY Some words you might not know STEPS TO DEPLOY TO NETLIFY It will go to&hellip;&nbsp;<a href=\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/deploy-to-netlify\/\" rel=\"bookmark\">Read More &raquo;<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":{"_crdt_document":"","portfolio_post_id":0,"portfolio_citation":"","portfolio_annotation":"","neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","_themeisle_gutenberg_block_has_review":false,"openlab_post_visibility":"","footnotes":""},"categories":[43],"tags":[44],"class_list":["post-3328","post","type-post","status-publish","format-standard","hentry","category-resource","tag-netlify"],"_links":{"self":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/posts\/3328","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/comments?post=3328"}],"version-history":[{"count":3,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/posts\/3328\/revisions"}],"predecessor-version":[{"id":3334,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/posts\/3328\/revisions\/3334"}],"wp:attachment":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/media?parent=3328"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/categories?post=3328"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-sp24\/wp-json\/wp\/v2\/tags?post=3328"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}