Posts

Showing posts from 2019

Release 0.4, Second Blog

For my final release, I decided to stick with the project that I already worked on called Vibranium .  The ticket was to create a page pre-loader similar to the one that git-hub or medium websites use.  I never worked with animation in CSS before, so this issue was a great opportunity to learn something new. Steps to create an animation: The first step of building a CSS animation is to defining individual keyframes and naming an animation with a keyframes declaration. The second step is referencing the keyframes by name using the  animation-name  property as well as adding  animation-duration  and other optional animation properties to control the animation's behavior. Here's how I created a spinning square animation using keyframes in css: @-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } }

Release 0.4, First Blog

For the Final release, I have a few projects to work on in mind. The first one is  VS Code , and I'm also looking into  Filer  issues. Here's the one ticket I'm trying to do now:  https://github.com/Microsoft/vscode/issues/71690 It requires adding a border around the vscode window, in order to be able to differentiate vs code from Visual Studio when using both at the same time, and their windows overlap. In order to set up this project, I used:  yarn watch  to start TypeScript incremental builder. And then:  .\scripts\code.bat   to test the changes. In case this ticket won't work out, I'm planning to continue working on  Vibranium  project from my previous release. Issue:  https://github.com/kelvinkamau/Vibranium/issues/63

Release 0.3

Image
In the third release, I was working on the  Vibranium GitHub project. Setting up a project on my machine took me a while, but was useful in terms of getting familiar working with Firebase which I never used before. Firebase is basically a mobile and web application development platform. In order to get the project working, I had to install node, run " npm install " and install firebase using " npm i -g firebase-tools "  command. In order to host your project using Firebase, you first need to create a Google Firebase account and then create a project on their official page. After doing that, login into your account from the terminal using " firebase login " and run " firebase init " in order to create firebase.json file. Add a project from firebase console using " firebase -add project-name " and finally publish it with " firebase deploy ". The issue I picked was to create a custom 404 error page when the server is unabl

Release 0.3, Update 1

For the third release, I was looking into a bunch of different tickets, but it turned out to be quite hard to find a good one. Some of the tickets I found were still open, but already fixed in the code, others required more info to start working on them, and I couldn't get any response from the team. For now, I ended up looking into Marquez  project. It has a lot of nice tickets, but I'm still having troubles to get it working on my machine. Other tickets that I consider working on are: https://github.com/natlas/natlas/issues/113 https://github.com/Marko-Doornbos/tournament-site/issues/12 https://github.com/ICT4Dat/ict4dat-news-android/issues/159

Lab8 Issues for future releases

In the third release, I'm planning to work on one of my previously selected projects. From my experience with popular GitHub open source projects, sometimes it might take a lot of time to get any reply from their team, which might be a problem if I come up with any questions along the way. Moreover, picking a project from the previous release will save time on setting up the project and getting familiar with it. Slothpixel project One of the good options to work on in the next release is Slothpixel project. It is an open source Hypixel data platform which is currently at the early stage of its development. It uses React JavaScript library to build user interface. React is considered to be one of the most demanded programming skill in the job markets and one of the most popular javascript frameworks. So it will be a perfect add-on to my resume. The issue I might work on: -  https://github.com/slothpixel/ui/issues/3

Final Summary Blog Post

The second release was very useful in terms of learning how to work with git commands and how to find, setup and contribute to a bunch of different open source projects. As it turned out, the hardest part of the whole process for me was setting up a new project on my machine. Some times you can't manage to get a part of the required technology to properly install and work, other times something that is already installed on your machine interferes with new stuff. Eventually, you might end up spending more than 3 hours just to get everything working, and submit your pull request only after a few minutes of working with actual code.  Another issue of working on open source projects is the complexity behind finding a good bug that you can take over and work on. Some tickets lack a good description, some don't have any at all. Looking for a good issue to work on, you can discover that the project doesn't have any documentation and most of the time you can neither understand wh

Release 0.2, Fourth PR

On the fourth week, I was working on the same project as on the previous one, called  Marquez . For my last PR I was doing some code cleanups marked with "good first issue" label. This time the main task was to add some cleanliness and consistency to the code by changing all variables referencing "Datasets" to use the same style and format. As I already had the project installed on my machine, it was a pretty quick fix. Using Visual Studio Code search function I was able to find all mentions of "Datasets" in all project's files. A very useful thing for my search was finding the Match Case (Alt+C) function that is located right beside the search field. This function allowed me to perform a case-sensitive search, only displaying the relevant results. My Issue: https://github.com/MarquezProject/marquez/issues/350 My PR: https://github.com/MarquezProject/marquez/pull/362

Release 0.2, Third PR

This week I was contributing to an open source project called Marquez . It is a metadata service for the collection, aggregation, and visualization of a data ecosystem's metadata. It also maintains the provenance of how datasets are consumed and produced, provides global visibility into kob runtime and frequency of dataset access, centralization of dataset lifecycle management, and much more.  The technologies this project uses are the following: Java 8+ PostgreSQL 9.6  For my third PR I picked an issue some of the classes that are used throughout the code. So I was looking for all occurrences of those replacing them with a new name. After creating a branch and making my changes I made sure that all tests pass locally using ./gradlew test  command. Another important thing before pushing my changes and creating a pull request was to check if all .java files are formatted properly. I did that using  ./gradlew spotlessJavaCheck   command and noticed that a bunch of tests is fai

Release 0.2, Second PR

This week I was working on  Umbraco  Documentation project.  The purpose of this project is to provide overviews of concepts, tutorials, example code, and links to API reference. On their GitHub, they provided all necessary information for the contributors. From the list of their issues, I found one that required to make a small fix in the broken link on one of their documentation pages.  The issue was marked with "good first issue" and "community/up for grabs" labels. After forking a repo and cloning the folders I created a branch to make my changes, replaced the old link with a new working one and created a Pull Request linking it in the comments to the issue. After I pushed my changes it took about a day or two for the project maintainer to review and merge my PR. So the issue is closed now and my pull request has been merged. My Issue:  https://github.com/umbraco/UmbracoDocs/issues/1548 My PR:  https://github.com/umbraco/UmbracoDocs/pull/1554

Release 0.2, First Pr

This week I was working on an open source Hypixel data platform called Slotpixel . The project is in the early stage of development, and yet they have no code in production. However, it was a good chance to gain experience contributing to a new project and practice the workflow. The technologies this project uses for its front-end are the following: View: React State Management: Redux CSS: styled-components Back-end: Microservices: Node.js Database: MongoDB/Redis For my first issue, I picked a small bug that asked me to fix the alignment of an icon on the website. The instructions for this issue were really straightforward, they included the screenshot depicting the problem and listed all files that might be related to this bug.  After I forked the repo and followed all instructions to quickstart and configure the project (it required to install node.js and to do some reading on React and Redux ) I was able to create a branch for my issue and finally start wo

Discovering Open Source Projects

Image
Go (Golang) Go is a compiled programming language. Like all others, it wants to be "better than C." The language development is supported by Google (the creators of the language are Rob Pike, Robert Griesemer and Ken Tompson). Go is completely open-source, and a large number of people not from Google also take part in its development. I got interested in the language because of its simplicity and unusual approach to OOP and multithreading.  The main advantages of Golang: Simple and clear syntax Excellent performance Rich standard library Highly Concurrent Go compiler (Error checking, cross-compiling) Open source Charming logo So looking for an open source project, I found 3 that might be interesting to contribute to:  Kubernetes Its io Moby  Kubernetes What is Kubernetes?  "Kubernetes is a portable, extensible open-source platform for managing containerized workloads and services, that facilitates both declarative configuration and automa

Lab2, Git Commands

Image
"git reset" command  git reset command is used for undoing different types of changes. Using it we can either discard commits in our private branch or throw away uncommitted changes. You can pass different parameters to your reset command in order to determine the command's scope. git reset command has 3 different modes: --soft  The staged snapshot and working directory aren't changed. --mixed (default) The staged snapshot is updated to match your commit, the working directory isn't affected. --hard  The staged snapshot and working directory are both affected. The most frequently used but at the same time the most dangerous option. It completely erases things you no longer want to have. Removing your last commit example For example, we committed some changes to our file, but made a mistake and want to revert those changes. One of the ways to do that is to use"reset". git reset HEAD~1 command will throw away the latest com

Filer Project, Release 0.1

Image
The main purpose of Release 0.1 was to get familiar working with GitHub and using Git commands. We were contributing to the Filer web filesystem project refactoring the code to use "let" or "const" instead of "var" for creating variables and constants.  Both "let" and "const" are block-scoped and preferred over "var". The only difference between them is that "const" values can't be reassigned. So unless your variable is going to change you should always use const.  Strict Mode in JavaScript In order to activate strict mode you should add "use strict" directive on top of your code. The benefits of this mode are the following: eliminates some silent errors (throws errors instead) helps to write a secure JS code disables confusing features  Not Allowed in Strict Mode Use undeclared variables/objects Delete a variable/function Duplicate a parameter name Octal numeric literals Read-only/

fs.rmdir() vs fs.rmdirSync() in Node.js

The main purpose of rmdir() and rmdirSync() methods in the fs module is to remove a directory. If you are going to use any of these two methods, you should also remember that using them it is only possible to remove an empty directory. In case your goal is to get rid of the folder which contains another files or directories you would need to install the additional fs-extra module that would add more features on top of the fs. You can use remove() method from the fs-extra module to delete directories that contain something. fs.rmdir(path, callback) Removes a directory asynchronously. If the directory isn’t empty the function will throw an exception. Passed Parameters: path – string, path to the directory which you want to remove. The function won’t work if you will pass a path to the file instead of the directory (will result in ENOENT error on Windows and an ENOTDIR error on POSIX) callback – function, returns an error. Source code:  function rmdir(path, callback