How to Start Contributing to Textile Photos

Unsplash

Last week, I joined the Textile team as an engineering intern. I spent the bulk of the week setting up my development environment, reading documentation, and exploring the code for our awesome new photo storage and sharing application, Textile Photos. Since Textile believes in writing well-documented, progressive, and intuitive code, the setup process was fairly simple. Along the way, I learned the basics of Textile’s command line tools, how to setup a local development environment for Textile Photos, and best practices for contributing to our open-source repositories. If you’re interested in contributing to Textile (and you should be), here’s a simple guide to getting started, informed by my own experiences over the past week. For reference, I am developing on a machine running Windows 10 and testing the application on Android, but the basic tenets of this guide will be applicable to all operating systems and platforms.

Step 1: Install Textile

You may be interested in Textile’s mission, but unsure exactly what we offer. At its most basic level, Textile is a platform that provides encrypted, recoverable, schema-based and cross-application peer-to-peer storage. In simpler terms, we’re building a toolkit that makes it easy to build private, transparent, and decentralized applications. If you want to start storing your data on Textile, you can use any of our applications, like Photos and Notes, or build your own. Our most basic product is a command-line tool which runs a daemon that implements our core API. A daemon is essentially a server that runs in the background and carries out Textile API calls. It also provides a command-line client that connects to the aforementioned server and lets you directly interface with our platform. To get started, you don’t need to understand the ins and outs of all of this. Just follow the instructions on the installation page of our documentation. If you’re running Windows like me, you may need to manually add the folder you put the Textile executable into to your path, so that you can access it from the terminal. Verify that you have it installed by running textile --help in your terminal:

Step 2: Go Through the Tour of Textile

Textile has an all new guide to getting started with our platform: A Tour of Textile. It’s an extensive guide that walks you through all of the major features of Textile, with simple explanations of the major concepts the Textile platform is built around. To prepare for my work, I went through the whole tour, and walked away with a much stronger understanding of the Textile platform. I’d recommend manually typing in every command, so that you get a tactile feel for everything Textile can do. Check it out.

Step 3: Make Your First Contribution

While you were going through the tour, you probably found something in it that you could improve. Maybe there’s a special installation step for your operating system that was left out, a concept that you think that you could explain better, or just a minor grammar mistake that you couldn’t get over. Whatever the issue, you’re empowered to fix it yourself, because like our code, our documentation is totally open source. Open a pull request on our docs and make your first contribution to Textile today!

Step 4: Set Up A Local Development Environment for Textile Photos

Okay, so you’ve gone through the docs, and you’re ready to start working on an actual application. To work on Textile Photos on your machine, you’ll need to have node.js installed. To demo the application on your desktop and see your changes in real time, you’ll need to install Android Studio and Genymotion, an android emulator. Although you can use the stock emulator that comes with Android Studio (I did for about a day), I found that Genymotion was significantly faster on my machine. Once you have those tools installed, follow the steps below to get Textile Photos up and running.

Clone the Repository

Start by getting the latest code for Textile Photos from GitHub by running the command git clone [email protected]:textileio/photos.git. This will download the application code and store it in a directory called photos on your computer.

Install the Dependencies

Next, you need to install the libraries and SDKs that Textile Photos uses internally. Open up the new photos directory we made in the last step in a terminal and run npm i to install them. If you prefer using the Yarn package manager, just run yarn.

Start the Packager

Textile Photos is built using an awesome framework called React Native. During development, React Native will run a packager — a server that bundles your code and deploys it to your device or emulator — so that you can see changes you make in your code in real time. Start this tool up on the command line by running react-native start from your photos directory.

Start Genymotion (or the stock Android Emulator)

Now, it’s time to start up the emulator you’re going to actually test the application on. If you’re using Genymotion like me, just right click your emulator select “Start.” You can also test the application on the stock android emulator, or on a physical device. Since I didn’t choose those routes, I’ll defer their specific setup instructions to other guides.

Run the App from Android Studio

Finally, open your application in Android Studio and click on the start button (a green play arrow). When you’re asked what virtual device to use, select your Genymotion device. Wait a bit, and you’ll see the Textile application start up on your emulator.

Change Something!

Modify some text in the application code, and voilà, you’ll see your changes reflected in the emulator!

A Quick Note About .env

Textile Photos uses a file called .env in the root of the photos folder to store special environment variables, which the application uses to access APIs, send emails, and do all sorts of tasks. To use our default configuration, rename .env.example to .env before starting it. When you start up the application and it asks you for a referral code, use the word SOMETHING, or whatever is set to the RN_TEMPORARY_REFERRAL variable in .env.

Step 5: Explore!

You now have a development environment for our application up and running, and you can tinker with our code-base to your heart’s content. Add features, fix bugs, or just mess around. That’s the beauty of open-source software: it’s up to you!

While you’re exploring, feel free to jump on our community Slack channel, where you can ask any questions, share ideas, or just say hello 👋. If you like what you see here, you can also feel free to reach out to the Textile team on Twitter or email to find out more, discuss collaboration opportunities, or even talk about integrating Textile into your next app or project.

Thomas Hobohm

Thomas Hobohm