 Thank you. So, hi everybody. Good afternoon. How's everything going so far? Good. Thank you for having me here. I will be giving a quick overview about why and how to contribute to Calypso. This presentation is not strictly for programmers. There will not be a single line of code here. And it will touch on the many different ways where we can contribute to Calypso, so not just in programming. And my name is Hafiz Rahman. I am a happiness engineer for automatic. I am from Indonesia. I live in a small town called Manan, which is pretty close from Singapore. It's about two hours of flight from here. So, what is Calypso? How many of you are already familiar with Calypso? I hope everyone is. So, I am definitely not going to talk about Calypso music and dance. So, if you are here for that, then this presentation is not going to be much of help for you. Instead, I'm going to be talking about this one. So, here's Calypso. Please ignore the fact that I only have, like, two visits in September. My site is not exactly a very busy site. So, Calypso is the new admin area for WordPress.com. It works for WordPress.com sites and also for self-hosted WordPress, if you connect your site with Chatpack. And here's how the editor looks like. It's pretty different from the WP admin editor. So, what's new in Calypso is like, it has several new features. It's fast because it's like a single-page application. If you change something, it doesn't reload everything. It's responsive. It works in desktop, tablet, and mobile. And it's multi-site. It works for multi-site from the beginning. So, if you have multiple sites, it's easy to switch from one site to another to work on posts and everything. There's a new editor. There's the reader feature when you can follow and get updates from sites. So, it's kind of like an RSS feed reader, and it's 100% open source. If you would like to read about the announcement about Calypso, it's not exactly that new. It's released about one year ago. You can read more at this URL. Calypso is also available as OSX, Windows, and Linux apps. There's also the web version, which can be accessed on WordPress.com. If you'd like to try out the apps, you can go to apps.wordpress.com and download stuff from there. And the technology behind it, it's 100% a JavaScript app. It uses Node.js. It uses React for the user interface library. And it uses Redux for the state container library for it. Next, we move to why would you want to contribute to Calypso? This is what Matt said during the State of the World at Workamp USA 2015. He said that he believed that JavaScript and API-driven interfaces are the future of not just WordPress, but for all the web. I think Calypso is one interpretation of how we can use JavaScript and API-driven interface to build something new for WordPress. And by contributing to it, we can get to learn about one way how to get that done. Another reason is that Calypso is an app that's used everyday by a lot of users on WordPress.com. There are like 22.8 billion page views every month. 45.3 million of new posts are created every month. So before I joined Automatic, I was a freelance web developer, mostly working with small clients. So the difference between Calypso and what I worked on before is totally different. There are more users, there are different expectations, different limitations. There are things you can do with a small number of visitors that might not work on a bigger scale. And aside from just learning programming or JavaScript from Calypso, you can actually learn and take a look about the many different aspects of running an app as a company. You can learn about design decisions, the business aspects of Calypso. You can take a look at how AP testing is done. You can take a look at software testing is done. You can also see the new features being developed. Here is one example of a design discussion inside Calypso. The story here is that WordPress.com offers several levels of plans. There are free plans, personal plans, premium plans, and so on. And plans comes with a lot of features. They work a lot with users and it's actually pretty common to see that users do not actually know what features come with the plan that they have. So they don't know that if they have premium plans, they don't know that they can purchase their own custom domain names and everything. So here the design discussion is about creating a specific plans page to showcase all the features that are available inside the plan in the hope that users can make use of all of those features. Here is another example of discussion about more about the business aspect of Calypso. Here we are talking about how to get people to upgrade. So on WordPress.com people can buy a custom domain name and then use it on their site. So they have their own address, something something.com, not something.wordpress.com. And this particular discussion is about getting these people to upgrade to one of the available plans. If we are looking at it, the code solution for this particular issue is probably pretty simple to create. But the interesting part is the actual discussion behind it. Here's an example about one of the many A.B. tests being done in Calypso. This is an A.B. test for the signups steps. So normally when you are signing up to WordPress, you get first to enter your username, your emails, and then the address you want to use and everything. This particular test is to add a preview. So after you enter your site name, you get to pick a theme, and then this test will show you the preview of that theme. If we are just thinking about it logically, it seems like a pretty useful feature for people, but it turns out according to the test, it causes a drop in signup completion because this feature just adds one more thing for the users to do. So it turns out adding that feature is not a good thing, and the test is stopped. That's one example of the things that you can learn from Calypso. So how to contribute to Calypso? The main repository for Calypso is available in GitHub. Here's a link. Speaking very broadly, there are two different avenues where we can learn and contribute to Calypso. First is in the form of GitHub issues. So if you are testing Calypso and then you see some bug reports or you have some questions and you have ideas or suggestions for it, then you can create a GitHub issue. And the second way is to actually, if you are about to add an actual code contribution, you can create pull request. The way it works in Calypso is that if you want to work on something or to fix an issue, you create a new branch locally and then you work on your changes there and then when you're done, you make a pull request out of it. And then it will then be reviewed. And if it's deemed to be a code change, then it will be merged to the actual site. If you're actually at this stage where you are able to make the code changes, you probably don't need me to show you how to create those pull requests and everything. So I'm going to just skip this part. So one way to get started with ClipStock is that you can run it locally. These are the whole steps that's needed. You don't need to memorize all these. It's available on the GitHub page on the readme. If those steps contain too many confusing directions for you, there's an alternative. There's a site called ClipStockLive, which is a site that runs the current most updated version of ClipStock, which in itself is not very interesting. But there are several things you can do with it. You can check the documentation directly by going to that link. You can also test a branch directly by using the link. ClipStockLive, question mark branch equals the branch name. So if you want to test somebody's pull request, you can just write the branch name there, and then it will load that and you can taste it that way. And it's especially useful if you want to test on mobile. Because if you have things running locally on your computer, it's probably pretty complicated to have it running on your mobile devices. So you can use ClipStockLive instead. So in ClipStock, both issues and pull request follow a simple title and leveling system to make things just clearer and easier to understand. Prefixes mostly are used to indicate the feature or the section of the site that's being worked on. And labels are used to indicate various status of it, like feature, priority type and status. Here's an example of how it looks. The first reader part means that the issue is about the reader feature. And the two colored text are the labels. It's a question and it's also set as reader to categorize it. If you want to write your own bug report or your question or suggestions and you're not sure what the labels to add, you can just skip all of that and somebody will add the right labeling for you. So you don't have to worry about all that. If you want to get started, here are some useful labels that I would recommend. First, there's a label that's called Good First Change. You can filter by label on GitHub. And here are some examples of Good First Change issues. There's a sample there, like the third one is the site preview link in my site's menu. It's potentially confusing. It's probably just going to involve changing text on the UI, so it doesn't require a lot of thinking or programming. Or the fourth one is inviting person with long email address on narrow screens, resizes, filled off-screen. This is probably just going to need some kind of responsive CSS fix. So if you want to contribute, it's probably not going to be too difficult to do. Another label I would recommend is the review needed. There are several labels. There are pull requests that needs design review. Things that needs internationalization review. And the yellow one is if a pull request needs a code review. There's an example of the stuff that needs design reviews. These are the ones that needs code reviews. And the last thing I suggest to check is the label called OSS Citizen. If you are creating issues or pull requests and you're not an automatic employee, then your issues or pull requests are probably going to be tagged with OSS Citizen. There are already several contributions by non-automatic employees that's already been merged and added to Prolipso. There are over 180 contributions so far. So if you want to try doing the same thing, you can take a look at how it was done by others. Look at some examples from there. And if you're interested, you want to get started. You can check the development documents on that page. There are things there like programming guidelines, design guidelines, or contributing guidelines which can help you get started. And if you feel like contributing to Prolipso in many different ways, it's what you're interested to do in the future. Join us at Automatic. You can visit that link. And thank you very much. Thank you. So anybody wants to ask anything about Prolipso? I have a question, although it's not related to Prolipso. I want to know what is happiness engineer in second? Happiness engineer actually is a role for customer support. We are a user-facing staff. We do live chats and take a support every day. And also, we do what I call a product review. We kind of get input from users and then we send them to the developers. There are things that need to be fixed, things that need to be improved. So we're kind of like in between the development. Yes. So if I understand your question correctly, the first one is if Prolipso is going to be added or merged to WorldResco? Okay. That's not going to happen. It's something that lives on WorldResco.com, but it's not something that's going to live on core. And sorry, what was the second question again? Oh yeah. So for the current version, if you have a chat pack, you can connect your site to Prolipso and then you can use the interface on WorldResco.com to access these sites. So my example site that I showed before, it's actually also a self-hosted site. It's not on WorldResco.com. But I think there are currently a few limitations of what you can do on Prolipso. For example, if you have metal fields or various different plugins on your site, it's probably not going to show up yet on Prolipso. So there are the available management options, like the general ones like creating posts, creating pages. So yeah, you can access it, but at this version it's not as complete as you might expect from your WP admin interface. How does Prolipso compare to managed WP? To be honest, I have not used managed WP site so I don't know how to compare, but do you have any specific question about if there's a feature you want to ask or whether it's available in Prolipso or not, or something else? All right. Thank you, Abis. We're almost reached at the end of our work camp, but we have one last question.