{"id":2349,"date":"2024-08-11T09:08:52","date_gmt":"2024-08-11T13:08:52","guid":{"rendered":"http:\/\/sites.bu.edu\/marcom-team\/?page_id=2349"},"modified":"2025-11-07T13:01:49","modified_gmt":"2025-11-07T18:01:49","slug":"starting-a-new-project","status":"publish","type":"page","link":"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/common-processes\/starting-a-new-project\/","title":{"rendered":"Starting a New Project"},"content":{"rendered":"<div class=\"bu_collapsible_container \" aria-live=\"polite\" data-customize-animation=\"false\"><h4 class=\"bu_collapsible\" aria-expanded=\"false\"tabindex=\"0\" role=\"button\">In This Document, We'll Cover\u2026<\/h4><div class=\"bu_collapsible_section\" style=\"display: none;\"><\/p>\n<p style=\"text-align: left;\">Request and clone a new Git repository<\/p>\n<ul style=\"text-align: left;\">\n<li style=\"font-weight: 400;\" aria-level=\"1\">Ask for a new Git repository<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\">Get the SSH clone URL<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\">Clone your repository to Tower<\/li>\n<\/ul>\n<p style=\"text-align: left;\">Create the new Responsive theme<\/p>\n<ul style=\"text-align: left;\">\n<li style=\"font-weight: 400;\" aria-level=\"1\">Get your starter files<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\">Update the files\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"2\">css-dev\/style.scss<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\">functions.php<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\">package.json<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\">readme.md<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\">screenshot.png<\/li>\n<\/ul>\n<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\">Install development dependencies<\/li>\n<\/ul>\n<p style=\"text-align: left;\">Commit and push your changes to Git<\/p>\n<ul style=\"text-align: left;\">\n<li style=\"font-weight: 400;\" aria-level=\"1\">Stage your changes<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\">Commit your changes<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\">Push your changes<\/li>\n<\/ul>\n<p style=\"text-align: left;\">Set up your user-facing documentation<\/p>\n<p><\/div>\n<\/div>\n\n<div class=\"bu_collapsible_container \" aria-live=\"polite\" data-customize-animation=\"false\"><h4 class=\"bu_collapsible\" aria-expanded=\"false\"tabindex=\"0\" role=\"button\">New Hires Will Need\u2026<\/h4><div class=\"bu_collapsible_section\" style=\"display: none;\"><\/p>\n<p><strong>Initialize Your Development Environment:<\/strong><\/p>\n<ul>\n<li><span style=\"font-weight: 400;\"><a href=\"https:\/\/nodejs.org\/en\" target=\"_blank\" rel=\"noopener noreferrer\">Node<\/a> and <a href=\"https:\/\/www.npmjs.com\/package\/npm\" target=\"_blank\" rel=\"noopener noreferrer\">Node Package Manager<\/a>[<code>npm<\/code>] installed.<\/span><\/li>\n<li><span style=\"font-weight: 400;\">A <code>git<\/code> <a href=\"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/role-specific-info\/designers-developers\/understanding-git-source-version-control\/\">GUI or CLI<\/a> client, such as <\/span><a href=\"http:\/\/www.git-tower.com\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"font-weight: 400;\">Tower<\/span><\/a> or <a href=\"https:\/\/confluence.atlassian.com\/get-started-with-sourcetree\" target=\"_blank\" rel=\"noopener noreferrer\">Sourcetree<\/a>.<\/li>\n<li aria-level=\"1\"><span style=\"font-weight: 400;\"><a href=\"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/role-specific-info\/designers-developers\/setting-up-to-dev\/code-editors\/\">A working text editor with SFTP access<\/a><\/span><\/li>\n<li aria-level=\"1\">[If this is your first time:] Follow the <a href=\"https:\/\/github.com\/bu-ist\/responsive-framework\/wiki\/Getting-Started\"><span>Getting Started information<\/span><\/a>.<\/li>\n<li aria-level=\"1\"><span style=\"font-weight: 400;\">Obtain your own <\/span><a href=\"https:\/\/help.github.com\/articles\/generating-ssh-keys\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"font-weight: 400;\">SSH key<\/span><\/a>[A Developer can assist: check with Interactive Design&#8217;s Director of Development to have one resourced to help.] and individual <a href=\"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/role-specific-info\/designers-developers\/common-processes\/obtaining-an-individual-sandbox\/\">Sandbox<\/a> to SFTP to.<\/li>\n<\/ul>\n<p><div class=\" bu-callout aligncenter\"><\/p>\n<h3>Common NPM Issue<\/h3>\n<h5>New Machine<\/h5>\n<p>While following the <a href=\"https:\/\/github.com\/bu-ist\/responsive-framework\/wiki\/Getting-Started\"><span>Getting Started information<\/span><\/a>, if you&#8217;re on a very new machine and OS and you&#8217;re hitting a snag with installing <code>grunt<\/code>,\u00a0 all you need to do is repeat the command with <code>sudo<\/code> in front of it.<\/p>\n<p>This error happens because your system doesn\u2019t allow the current user to create a symlink in a protected directory[your <code>user<\/code> directory on the hard drive].<\/p>\n<p><\/div><\/p>\n<p><\/div>\n<\/div>\n\n<hr \/>\n<div class=\" bu-callout aligncenter\"><\/p>\n<h4><strong>Creative Directors request new repositories. <\/strong><\/h4>\n<h4><strong>Developers initializing them in GitHub. <\/strong><\/h4>\n<h4><strong>Designers follow this process.<\/strong><\/h4>\n<p><\/div>\n<h2><strong>Request and clone a new Git repository<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">To track your changes, Tower needs to know two things \u2013 what Git repository it should compare your code to, and where your code lives on your computer. These steps take care of that.<\/span><\/p>\n<p><span style=\"font-weight: 400;\"><img loading=\"lazy\" src=\"\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1024x765.png\" alt=\"\" width=\"1024\" height=\"765\" class=\"aligncenter wp-image-2503 size-large\" srcset=\"https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1024x765.png 1024w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-150x112.png 150w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-636x475.png 636w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-768x574.png 768w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1536x1148.png 1536w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-2048x1530.png 2048w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-361x270.png 361w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-668x500.png 668w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-500x373.png 500w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-552x413.png 552w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-834x624.png 834w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-903x675.png 903w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-746x558.png 746w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1129x844.png 1129w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1444x1080.png 1444w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-600x448.png 600w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-496x370.png 496w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-750x560.png 750w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1000x747.png 1000w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1105x826.png 1105w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1337x1000.png 1337w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1669x1248.png 1669w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-992x741.png 992w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1200x896.png 1200w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1500x1121.png 1500w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1493x1116.png 1493w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-1806x1350.png 1806w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-550x411.png 550w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-710x530.png 710w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-400x298.png 400w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.08.48\u202fAM-300x224.png 300w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/span><\/p>\n<h4><strong>Clone the Repository with Tower<\/strong><\/h4>\n<p><span style=\"font-weight: 400;\">In Tower, go to your repositories pane, find your repository and click \u201cClone.\u201d<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Enter your SSH URL in the dialog that comes up. You should see something akin to the following screen:<\/span><\/p>\n<p><img loading=\"lazy\" src=\"\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-636x404.png\" alt=\"\" width=\"636\" height=\"404\" class=\"size-medium wp-image-2504 aligncenter\" srcset=\"https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-636x404.png 636w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-150x95.png 150w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-768x488.png 768w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-1024x651.png 1024w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM.png 1038w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-424x270.png 424w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-786x500.png 786w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-500x317.png 500w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-649x413.png 649w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-981x624.png 981w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-877x558.png 877w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-600x381.png 600w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-496x315.png 496w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-750x476.png 750w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-1000x635.png 1000w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-992x630.png 992w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-550x349.png 550w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-710x451.png 710w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-400x254.png 400w, https:\/\/sites.bu.edu\/marcom-team\/files\/2024\/08\/Screenshot-2024-08-12-at-5.11.43\u202fAM-300x190.png 300w\" sizes=\"(max-width: 636px) 100vw, 636px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">(If you don\u2019t have anything under SSH-Keyfile, now is a good time to <\/span><a href=\"https:\/\/help.github.com\/articles\/generating-ssh-keys\/\"><span style=\"font-weight: 400;\">generate that SSH key<\/span><\/a><span style=\"font-weight: 400;\">. You can check if you have an SSH key <\/span><a href=\"https:\/\/github.com\/settings\/keys\"><span style=\"font-weight: 400;\">here<\/span><\/a><span style=\"font-weight: 400;\">.)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Once you have everything as you like it, go ahead and hit <strong>Clone<\/strong>.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><strong>Create the New Theme<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Even though you cloned the new repository, you still don\u2019t have any files to edit. That\u2019s because the repository you just cloned from is blank. It\u2019s up to you to add files \u2013 the new child theme \u2013 to your repository.<\/span><\/p>\n<div class=\" bu-callout aligncenter\"><\/p>\n<h4><strong>This process assumes the developer hasn&#8217;t already initialized Responsive Child Starter 3x into the project Repository; designers can skip over &#8220;Get Your Starter Files&#8221; i<\/strong><strong>f the developer has.<\/strong><\/h4>\n<p><\/div>\n<h4><strong>Get Your Starter Files<\/strong><\/h4>\n<p><span style=\"font-weight: 400;\">Download and unzip the <\/span><a href=\"https:\/\/github.com\/bu-ist\/responsive-child-starter-3x\"><span style=\"font-weight: 400;\">responsive-child-starter-3x theme<\/span><\/a><span style=\"font-weight: 400;\"> into the same folder you cloned your new Git repository into. This gives you some base files to start your new theme. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Always download directly from that repository<\/span><span style=\"font-weight: 400;\"> so you&#8217;re always starting with the latest version of Responsive Foundation &amp; Framework.<\/span><\/p>\n<h4><strong>Update the Files<\/strong><\/h4>\n<p><span style=\"font-weight: 400;\">Update the following files with these items:<\/span><\/p>\n<p><span style=\"text-decoration: underline;\"><strong>css-dev\/style.scss<\/strong><\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\"><a href=\"https:\/\/github.com\/bu-ist\/responsive-child-starter-3x\/blob\/a18216bee05900cb22d6761f87b6a0a655cc83b6\/css-dev\/style.scss#L2\" target=\"_blank\" rel=\"noopener noreferrer\"><strong>Theme Name<\/strong><\/a>: Replace <code>Responsive Child Starter<\/code> with the theme name you want displayed in the WordPress admin that lists themes. Use this convention: <code>{School Name} (R3)<\/code><\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\"><a href=\"https:\/\/github.com\/bu-ist\/responsive-child-starter-3x\/blob\/a18216bee05900cb22d6761f87b6a0a655cc83b6\/css-dev\/style.scss#L6\" target=\"_blank\" rel=\"noopener noreferrer\"><strong>Description<\/strong><\/a>: Replace <code>Enter child theme description here<\/code> with the description you want displayed in the WordPress admin. Use this convention: <code>A Responsive Framework 3x child theme for {School Name}.<\/code><\/span><\/li>\n<li aria-level=\"1\"><a href=\"https:\/\/github.com\/bu-ist\/responsive-child-starter-3x\/blob\/a18216bee05900cb22d6761f87b6a0a655cc83b6\/css-dev\/style.scss#L7\" target=\"_blank\" rel=\"noopener noreferrer\"><strong>Template<\/strong><\/a>: Make sure it&#8217;s set to <code>responsive-framework-3x<\/code>.<\/li>\n<\/ul>\n<p><span style=\"text-decoration: underline;\"><strong>package.json<\/strong><\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\"><code>\"name\"<\/code>: Replace <code>responsive-child-starter<\/code> with your theme name <code>r3-{schoolname}<\/code><\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\"><code>\"description\"<\/code>: Replace <code>A starting point for Responsive Framework child themes.<\/code> with the same description used for style.scss.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\"><code>\"repository\"<\/code>: Replace \u201c<a href=\"https:\/\/github.com\/bu-ist\/responsive-child-starter-3x\">https:\/\/github.com\/bu-ist\/responsive-child-starter-3x<\/a><\/span><span style=\"font-weight: 400;\">\u201d with the URL to your project&#8217;s GitHub repository.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\"><code>\"contributors\"<\/code>: Replace <code>Your Name &lt;you@bu.edu&gt;<\/code> with your BU name and email address.<\/span><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\"><span style=\"font-weight: 400;\"><strong>Adding contributors:<\/strong> This is your \u2013 and your friendly coworkers\u2019 \u2013 time to shine! You can add more than one contributor \u2013 just separate email\/name pairs with a comma. For example, you might know a designer or developer who will be working on the theme with you later. Now is a good time to add them so you don\u2019t forget.<\/span><\/p>\n<p><span style=\"text-decoration: underline;\"><strong>readme.md<\/strong><\/span><\/p>\n<p><span style=\"font-weight: 400;\">Update this file with a summary of what site your theme is for and what functionality your theme adds, if any.<\/span><\/p>\n<p><span style=\"text-decoration: underline;\"><strong>screenshot.png<\/strong><\/span><\/p>\n<p><span style=\"font-weight: 400;\">Don\u2019t forget to add a screenshot of the final design&#8217;s mockup! An empty thumbnail in the WordPress theme directory doesn&#8217;t do anyone any favors. Make one from your homepage mockup. See WordPress\u2019s <\/span><a href=\"https:\/\/codex.wordpress.org\/Theme_Development#Screenshot\"><span style=\"font-weight: 400;\">screenshot recommendations<\/span><\/a><span style=\"font-weight: 400;\"> for additional info regarding formatting.<\/span><\/p>\n<p>&nbsp;<\/p>\n<div class=\" bu-callout alignright\"><\/p>\n<h3>Common NPM Install Issue<\/h3>\n<h5>Incorrect NPM Version<\/h5>\n<p>If you receive the following [<code>#<span style=\"font-weight: 400;\">\u2019<\/span><\/code>s would be your version]:<\/p>\n<p><code>ERROR: npm v#.#.# is known not to run on Node.js v12.22.12.<br \/>\nThis version of npm supports the following node versions: ^14.17.0 || ^16.13.0 || &gt;=18.0.0.<\/code><\/p>\n<p>&nbsp;<\/p>\n<p>It means the theme package [the repository] was initialized on a different version.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>A quick fix is to check what number is in the directory&#8217;s <code>.nvmrc<\/code> file<\/strong> and adjusting to that node version by inputting <code>nvm use ##<\/code> in your terminal.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>For instance:<\/strong> if the <code>.nvmrc<\/code> file has <code>v16.20.2<\/code> run <code>nvm use 16<\/code> in your terminal.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/nodejs.org\/en\/about\/previous-releases\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"button-secondary\">Node &amp; npm Compatibility<\/a><\/p>\n<p><\/div>\n<h2><strong>Install Development Dependencies<\/strong><\/h2>\n<p><span style=\"font-weight: 400;\">Just as you should always get the newest version of the starter theme, you should always get the latest version of your dependencies by running npm install.<\/span><\/p>\n<p><strong>In Terminal:<\/strong><\/p>\n<p><span style=\"font-weight: 400;\">Change to the folder that holds your theme code. You can do this by typing <code>cd<\/code>, then go to Finder and drag and drop the repository folder into your Terminal window, like so:<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Press return, then run the following commands one by one:<\/span><\/p>\n<p><span style=\"font-weight: 400;\"><code>npm install<\/code><\/span><\/p>\n<p><span style=\"font-weight: 400;\">This will install your dependencies. Once everything has successfully installed, run the following command:<\/span><\/p>\n<p><span style=\"font-weight: 400;\"><code>grunt build<\/code><\/span><\/p>\n<p><span style=\"font-weight: 400;\">This takes care of your initial build. You should see several new files, including style.css, style.css.map, and a number of similar files. If you don\u2019t encounter any errors (warnings are okay), continue on\u2026<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2>Commit and push your changes to Git<\/h2>\n<h4><strong>Stage your changes<\/strong><\/h4>\n<p><span style=\"font-weight: 400;\">Before you can commit your new files to Git, you\u2019ll need to stage your changes. As you work on your theme, staging will give you an opportunity to review the changes in the code before committing them.<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">In Tower, within your Working Copy, you should see a number of new changes ready to stage and commit.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Stage your changes by clicking \u201cStage All.\u201d<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">There isn\u2019t a need to review your files at this point, but it can be helpful in future stage\/commits to look at your changes before you write your commit subject if you didn\u2019t commit for a while and forgot what you worked on.<\/span><\/p>\n<h4><strong>Commit your changes<\/strong><\/h4>\n<p><span style=\"font-weight: 400;\">Write a brief, but descriptive commit subject. In this case, use \u201cInitial commit.\u201d You don\u2019t need to fill out the detailed description.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In future commits, it\u2019s good to have a descriptive commit subject so that if you ever need to roll back your changes, it\u2019s easy to see exactly what point you need to roll back to.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">You can commit as frequently or infrequently as you like, but a good guideline is to commit each time you switch from working on one \u201cpart\u201d of the site to another. For example, if I were working on styles for the primary navigation for a while, and then decided I wanted to work on the homepage for a while, I\u2019d probably do a commit after I finished my navigation work, but before I started my homepage stuff.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Once you\u2019re ready, click \u201cCommit.\u201d This will commit your changes to your local repository.<\/span><\/p>\n<h4>Push your changes<\/h4>\n<p><span style=\"font-weight: 400;\">Once you\u2019re ready to make your changes available to others, you\u2019ll want to push them. Now is a good time to push your initial commit by clicking \u201cPush\u201d at the top of the page.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">You\u2019ll see a dialog with some options. You can leave all these options alone and keep going. You\u2019ll see this each time you do your first push to a new repository.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Push your changes each time you\u2019d like them to be available to other designers and developers. This isn\u2019t the same as making them live on a site \u2013 you\u2019ll still need to either <\/span><a href=\"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/interactive-design-workflow\/development\/starting-a-new-project\/#\"><span style=\"font-weight: 400;\">upload your files to NM<\/span><\/a><span style=\"font-weight: 400;\"> (when you\u2019re developing the site on our test servers) or <\/span><a href=\"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/interactive-design-workflow\/development\/starting-a-new-project\/#\"><span style=\"font-weight: 400;\">request a deploy<\/span><\/a><span style=\"font-weight: 400;\"> (when you want the changes to show up on staging or the live site).<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><strong>Set Up Client-Facing Documentation<\/strong><\/h2>\n<div class=\" bu-callout alignright\"> Remember to always leave a bit of room in your sprints for Editorial to proofread any documentation you draft of custom components. <\/div>\n<p><span style=\"font-weight: 400;\">Finally, you\u2019ll want to set up user-facing documentation right away so you can document your theme as you go. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">The freshest base documentation is always available at <\/span><a href=\"http:\/\/wpdocs.bu.edu\/\"><span style=\"font-weight: 400;\">http:\/\/wpdocs.bu.edu\/<\/span><\/a><span style=\"font-weight: 400;\">. <\/span><\/p>\n<p><span style=\"font-weight: 400;\"><a href=\"https:\/\/sites.bu.edu\/marcom-team\/departments\/interactive-design\/role-specific-info\/designers-developers\/common-processes\/cloning-sites\/\">Clone<\/a> that site to <\/span><span style=\"font-weight: 400;\"><code>http:\/\/wpdocs.bu.edu\/{your-theme-name}<\/code><\/span><span style=\"font-weight: 400;\"> and have a developer set up a documentation link in your admin bar. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">When your theme is close to done: finalize your custom documentation and apply your new theme. It\u2019s as easy as that!<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Request and clone a new Git repository To track your changes, Tower needs to know two things \u2013 what Git repository it should compare your code to, and where your code lives on your computer. These steps take care of that. Clone the Repository with Tower In Tower, go to your repositories pane, find your [&hellip;]<\/p>\n","protected":false},"author":12906,"featured_media":0,"parent":689,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/pages\/2349"}],"collection":[{"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/users\/12906"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/comments?post=2349"}],"version-history":[{"count":35,"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/pages\/2349\/revisions"}],"predecessor-version":[{"id":4114,"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/pages\/2349\/revisions\/4114"}],"up":[{"embeddable":true,"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/pages\/689"}],"wp:attachment":[{"href":"https:\/\/sites.bu.edu\/marcom-team\/wp-json\/wp\/v2\/media?parent=2349"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}