When making a code related change to the website, be sure to follow the best practices below.
- Check changes with a local offline copy before committing to master. See Running Locally below for how to set this up.
- Make sure existing code organization is followed. Not limited to but including:
- 2 space indents (not tabs) on both HTML and CSS.
- Indents are used where they should be to maintain hierarchy in code.
- Make sure you use the official team colors found here
- Also make sure to follow the branding standards of FIRST here
- All of the official logos for the programs of FIRST can be found in the drive here
- Please please PLEASE comment your code!
- Lastly: If you don't know, ask!
By running locally, you can preview the changes on only your computer. Then, if you like the way how changes are shown locally, push the code to master branch, which is the final code of the web site.
Start by making sure you have Ruby installed. Make sure you have admin access to your local computer (or use 'sudo') and type this in termial:
ruby -v
If nothing appears as a result, install Ruby. During the install of Ruby, when it comes to the terminal, just keep pressing ENTER.
Then install Bundler, if you don't already have it. Type this in terminal:
gem install bundler
If you're new to the team, you'll want to make a fork of the repository. This makes it easier for you to make changes and get them reviewed before they're added to the live site. You can do it on GitHub website. Open web site reposotory, and press "Fork".
Once you've forked the repository you'll want to access that code on your own computer. To do this just clone the repository down to your local machine:
git clone https://github.com/username/team178.github.io.git
(Make sure to replace username
with your username.)
Then you need to navigate into your newly cloned repository. Type "cd " and directory of the cloned reposotory. For example:
cd C:\Users\user\Desktop\team178.github.io
The last thing you need to do before you can run locally is do a bundle install
to install the required gems.
Then just run jekyll serve
to see the website running on http://localhost:4000
.
If you get any errors or warnings, try running bundle exec jekyll serve
instead. If that doesn't work, try the command bundle add webrick
.
And lastly, how to actually see it locally? Well, make changes in the code, open terminal and type "cd" and address of the reposotory on your computer, and type http://localhost:4000 in adress bar. That's how you see changes locally!
If, in the terminal, you get the following message or somthing similar...
Please add the following to your Gemfile to avoid polling for changes:
gem 'wdm', '>= 0.1.0' if Gem.win_platform?
Just add the gem 'wdm', '>= 0.1.0' if Gem.win_platform?
part to the Gemfile and push changes (Of course, the text will be different).
Some on the website team use Atom as our text editor of choice. If you already have a preferred text editor, you are free to use that! But if you are just starting out, you can try Atom.
You can get the installer for your OS on Atom's homepage. If you're on Ubuntu, you can use this guide: Guide for Ubuntu If you're on Windows you need to right click the installer and click "Run as Administrator". If it fails restart your computer and try installing it a couple of times. If that also fails go to Google for help. Atom gives you the ability to use packages. These packages can be used to modify how Atom works. For a complete list of packages for Atom go here. While there are a great many of packages that you can explore, we recommend that you install the package Pigments. It gives you a preview of colors in your code. Follow the instructions in Atom for how to install it.
If you don't like Atom, there are other options too!
VS Code is open-source and easy to run on all major platforms. It also features Microsoft's IntelliSense autocomplete features for a few languages. It's continually evolving, and looks great. Get Visual Studio Code here.
Notepad ++ is similarly cross-platform, and much simpler. It has been around for a long time, and has syntax highlighting for a lot of languages, and there are packages for even more. This project has a large amount of support and many packages available due to its age. The other two projects above are newer, and currently growing. It, unfortunately isn't as pretty. Get notepad++ here
We can't wait to get you involved.
This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0. If a copy of the MPL was not distributed with this file, You can obtain one at http://mozilla.org/MPL/2.0/.