Playbox! is a sandbox-proving-ground for people interested in working with us at Kalamuna. It's a magnificent and collaborative code-garden where would-be code artists, site builder and designers play around and show what they've got. It's also a place to ask questions, collaborate and learn. It's kind of like this. Think you've got what it takes to make good Internet? Make stuff in Playbox! now and find out.
You've been handed a Drupal 7 project called Megaman Robots vs US Presidents which was built by another development team. It is a Minimal Lovable Product (MLP). This means that it has all the core functionality it needs to deliver value but it lacks the full suite of features it needs to be face-meltingly awesome.
Additionally, the budget was tight at the end of the MLP phase so the code did not go through a rigorous testing or QA process. This means that the code is rife with bugs, fast and easy code, and not tested for mobile/cross browser compatibility.
Your mission, if you choose to accept it is two fold:
1. Help build out some of the remaining features that are listed here.
2. Explore the code, test the site, identify bugs, submit those bugs or suggest improvements and then make them real.
You should timebox about an hour or two but obviously feel free to spend as much time as you want. Focus on the things you want to focus on.
In order to get started you will want to do the following:
- Set up your own github.com account if you don't already have one.
- Set up a local development environment like Kalabox or Kalastack.
- Create a fork of this project.
- Import this fork into your local dev environment and set up its files and database.
- Set up your git repo for github flow. See below.
- Create a branch for the issue you are working on.
- Commit code and push it up!
Please refer to the Resources section below to aid in the above
Before you get started you will want to clone your fork of this projet and set up the canonical upstream repo.
From inside your webroot (generally /var/www)
git clone firstname.lastname@example.org:pirog/playbox.git playbox cd playbox git remote add upstream https://github.com/kalamuna/playbox.git git remote -v # this should list both an origin and upstream
You will want to replace email@example.com:pirog/playbox.git with your own fork. If you have already imported your site as in 4. above you can skip
You've selected issue a issue to work. The issue deals with responsive bootstrap fixes for IE6. Here is some code-fu that might happen while you contribute
git checkout master git pull upstream master # Grab the latest code from the canonical repo git push origin master # Push the new code up to your fork git checkout -b ie6-magix # Create a branch for your feature
YOU WRITE THE CODES
git status # List the files that have changed git add -A # Add all files you've changed to commit git commit -m "These are really awesome fixes that i made" git push origin ie6-magix # This will push your code up to `github.com/kalamuna/playbox`
- Submit a pull request for your issue.
- You may get requests to change your code. You can still commit code to the pull request using part 2 of the code samples above.
- Your code gets merged in by the project maintainer.
- The code runs through automated testing and then, if tests pass, it is deployed to http://dev-playbox.at.kalamuna.com/.
SUPER IMPORTANT: IN THIS MODEL YOU SHOULD NEVER EVER EVER EVER COMMIT CODE DIRECTLY TO THE MASTER BRANCH, LIKE EVER
Posting issues or feature requests is fairly straight forward. Simple go to https://github.com/kalamuna/playbox/issues/new. You may want to make use of the various tags there to better explain your issue.
But... I don't know how to write code?
That's OK! In Drupal you can do a lot of stuff just by using the user interface. In fact, almost all of this site was built this way. The problem with this is that in Drupal most of this configuration is stored directly in the database and as such is difficult to put into code.
Enter the features module which allows you to export what you build in the UI into code so that you can contribute using the workflows above. Almost all the code here was exported using features and you can scope it out at
**What if Cisco AnyConnect is hijacking my /etc/hots file **
Apparently, Cisco AnyConnect alters your
/etc/hosts in favor of another one
/etc/hosts.ac. In this case you will want to make sure you have something like the below in
/etc/hosts.ac otherwise your kalabox/kalastack will not function.
For more info please read: http://ubuntuforums.org/showthread.php?t=1896148
## # Host Database # # localhost is used to configure the loopback interface # when the system is booting. Do not change this entry. ## 127.0.0.1 localhost 255.255.255.255 broadcasthost ::1 localhost fe80::1%lo0 localhost 220.127.116.11 start.kala php.kala aliases.kala kala grind.kala solr.kala info.kala images.kala 18.104.22.168 playbox.kala
How do i log in?
To get into a Drupal site you usually navigate to the
/user directory. The database posted above has an admin user. If you are using drush (which comes with both Kalabox and Kalastack) this is really easy to do.
SSH into the box from the dash on kalabox or run
vagrant ssh from your kalabox directory. From there you can do the following:
cd /var/www/playbox drush @kalastack.playbox.kala uli
Copy this link into the browser for a one-time login as the admin user. Now you have all the powers!
I hear a lot of talk about code, files and database.. what are each?
In Drupal your site is separated into three components:
CODE: This is all the PHP/CSS/JS/HTML that comprises your application. It is usually stored in version control like
DATABASE: This is a SQL file living in a MySQL database. This contains most of the configuration and content for your application.
FILES: These are static assets like images, compiled CSS, videos, PDFs, etc. These usually live inside your CODE at
So... where is the code i should be looking at?
A typical drupal site is usually arranged in this way. Almost all the relevant code here will be in folders prefaced with
playbox_. For example here is a good breakdown:
sites/all/modules playbox_battles # This contains all the code that power the battle functionality. playbox_core # This contains stuff that all the other playbox_modules share playbox_presidents # Data model and theme stuff for Presidents playbox_robots # Same as above byt for robots playbox_scores # Contains all the scoring code playbox_static # Contains static HTML code blocks to be used playbox_theme # A helper module for the drupal theme. sites/all/themes playbox_theme # This is a [Kalatheme](https://www.drupal.org/project/kalatheme) subtheme powered by [Bootstrap](http://getbootstrap.com/).
Anything else that could be helpful?
Why yes and i'm glad you asked! Playbox is built on the popular panels based distribution called panopoly and a popular theme for that distribution called kalatheme. Reading the documentation for those projects could definitely help.
Getting help and doing your best
We recognize this may be a lot of information to learn and digest very quickly. That's OK! Feel free to ping any Kalamuna staff on any issues you may be having.
For example if you @pirog on a given issue with a question i'll get an email and will respond as soon as i can. Beyond that... the most important thing you can do is just try to contribute in anyway that you can.
There are no wrong or right answers to this and its not purely a test of technical chops but effort, what you do when you don't know the answer and things like that... SO RELAX and just play around :)
While knowledge of the below is not required and we encourage you to contribute in any way you can it may be helpful to have some understanding of the following.
- Drupal basics
- Local Development Environments
- Site building and contributing code to a drupal project
- git basics
- Collaborating with others with github flow
- Kalamuna wiki
This project was sponsored by Kalamuna.com as a way to teach, train and assess aptitude in all the things.