Author: rafalkowalski

This author has written 17 articles

KISS Datatable

Recenlty I’ve faced a problem with sorting columns in Datatable. What is Datatable? Datatable is a plug-in for Jquery library. It provides a lot of features like pagination, quick search or multi-column ordering. Besides, you can develop easily Bootstrap or Foundation ui css styles. There are also more other option but It doesn’t make sense to list it here, because you can visit their site and you can read clearly documentation. On Datatable website you can see a lot of examples. First of them shows how to improve your ordinary table to awesome and rich of features table. One function changes everything, It’s fantastic!   $('#myTable').DataTable(); Returning to my problem which I’ve faced, as I told it was problem related to sorting column in table. I know sorting is a trivial thing. I hope that everyone knows it :) Sorting by a date is also implemented in a datatable library. So everything is clear when we don’t change date format to human readable format. I mean something like this ‘3 hours ago’, ‘1 year ago’. When Open Event team tested how datatable manages ordering columns in that format it didn’t work. It’s quite hard to sort by that format, So I’ve invented an idea. Surely you are wondering what i’ve invented. I’ve postponed my minds about sort by this values. It can direct to overwork. When I thought about it, weird ideas came to my mind, a lots of conditions, If statements… Therefore I’ve resigned from this. I’ve used KISS principle. KISS means ‘keep it simple stupid’. I like it! Therefore that sorting is implemented on frontend side. I’ve decided not to display human readable date format at the beginning. I find  all dates which have format “YYYY-MM-DD HH:mm” then I replace that format to human readable format. So it’s very quick and comfortable, and doesn’t require a lot conditions to write. Of course I’ve tried to implement it in Datatable library. I suppose that it would  require more effort than it’s now. Below You can see great function which changes a date in frontend side but does not change data in a datatable. So sorting process takes place in a datatable using format  “YYYY-MM-DD HH:mm” but user see human readable format. Isn’t it awesome?! function change_column_time_to_humanize_format(datatable_name, column_id) {  $(datatable_name).each(function( key, value ) {    $(value).children().each(function( key1, value2 ) {       if(key1 === column_id ){          var current_value = $(value2).text().slice(0, 16);          var changed_value = moment(current_value, "YYYY-MM-DD hh:mm").fromNow()          var isValid = moment(current_value, "YYYY-MM-DD HH:mm", true).isValid()          if (changed_value !== current_value && isValid === true){              $(value2).text(changed_value)          }      }  }); });  

Continue ReadingKISS Datatable

Python code examples

I’ve met many weird examples of  behaviour in python language while working on Open Event project. Today I’d like to share some examples with you. I think this knowledge is necessary, if you’d like to increase a  bit your knowledge in python area. Simple adding one element to python list: def foo(value, x=[]):  x.append(value)   return x >>> print(foo(1)) >>> print(foo(2)) >>> print(foo(3, [])) >>> print(foo(4)) OUTPUT [1] [1, 2] [3] [1, 2, 4] First output is obvious, but second not exactly. Let me explain it, It happens because x(empty list) argument is only evaluated once, So on every call foo(), we modify that list, appending a value to it. Finally we have [1,2, 4] output. I recommend to avoid mutable params as default. Another example: Do you know which type it is? >>> print(type([ el for el in range(10)])) >>> print(type({ el for el in range(10)})) >>> print(type(( el for el in range(10)))) Again first and second type are obvious <class 'list'>, <class 'set'>. You may  think that last one should return type tuple but it returns a generator <class 'generator'>. Example: Do you think that below code returns an exception? list= [1,2,3,4,5] >>> print(list [8:]) If you think that above expression returns index error you’re wrong. It returns empty list []. Example funny boolean operators >>> 'c' == ('c' or 'b') True >>> 'd' == ('a' or 'd') False >>> 'c' == ('c' and 'b') False >>> 'd' == ('a' and 'd') True You can think that that OR and AND operators are broken. You have to know how python interpreter behaves while looking for OR and AND operators. So OR Expression takes the first statement and checks if it is true. If the first statement is true, then Python returns object’s value without checking second value. If first statement is false interpreter checks second value and returns that value. AND operator checks if first statement is false, the whole statement has to be false. So it returns first value, but if first statement is true it checks second statement and returns second value. Below i will show you how it works >>> 'c' == ('c' or 'b') >>> 'c' == 'c' True >>> 'd' == ('a' or 'd') >>> 'd' == 'a' False >>> 'c' == ('c' and 'b') >>> 'c' == 'b' False >>> 'd' == ('a' and 'd') >>> 'd' == 'd' True I hope that i have explained you how the python interpreter checks OR and AND operators. So know above examples should be more understandable.

Continue ReadingPython code examples

Twitter Oauth

What is Oauth? It’s an open protocol which allows to secure an authorization in a simple and standard method from web, mobile and desktop applications.Facebook, Google Twitter, Github and more web services use this protocol to authenticate user. Using Oauth is very convenient, because it delegates user authentication to the service which host user account. It allows us to get resources from another web service without giving any login or password. If you have a service and want to prepare a authentication via Twitter, the best solution is to use OAuth. Recently Open Event team met a problem in an user profile page. We’d like to automatically fill information about user. Of course, to solve it we use Oauth protocol, to authenticate with Twitter After a three-steps authentication we can get name and profile picture.If you need another information from Twitter profile like recent tweets or followers’ list. You have to visit Twitter API site to see more samples of resource which you can get How do Open event team implement communication between Orga-server and Twitter? All services have a very similar flow. Below i will show you how it looks in our case. Before starting you need to create your own twitter app. You can create app in Twitter apps site https://apps.twitter.com/. If  create an app you will see a CONSUMER KEY and CONSUMER SECRET KEY which shouldn’t be human-readable, so remember not to share these keys. Below example shows how to get basic information about twitter profile We use oauth2 python library https://github.com/joestump/python-oauth2 consumer = oauth2.Consumer(key=TwitterOAuth.get_client_id(),                          secret=TwitterOAuth.get_client_secret()) client = oauth2.Client(consumer) TwitterOAuth.get_client_id() - CONSUMER KEY TwitterOAuth.get_client_secret()  - CONSUMER SECRET KEY Then we send GET request to request_token endpoint to get oauth_token client.request('https://api.twitter.com/oauth/request_token', "GET") Response: oauth_token=Z6eEdO8MOmk394WozF5oKyuAv855l4Mlqo7hhlSLik& oauth_token_secret=Kd75W4OQfb2oJTV0vzGzeXftVAwgMnEK9MumzYcM& oauth_callback_confirmed=true Next step is to redirect user to Twitter Authentication site You can see in an url a redirect_uri. So after sign in Client will get a callback from Twitter with oauth_verifier and oauth_token params https://api.twitter.com/oauth/authenticate?oauth_token=RcYGqAAAAAAAwdbbAAABVoM1UMo&oauth_token_secret=wZfpPpCugAmdF3AuohEnvBTRxdCmllxu&oauth_callback_confirmed=true&redirect_uri=http://open-event-dev.herokuapp.com/tCallback The last step is to get an access token. If we have an oauth_verifier and an oauth_token it’s pretty easy def get_access_token(self, oauth_verifier, oauth_token):   consumer = self.get_consumer()   client = oauth2.Client(consumer)   return client.request(       self.TW_ACCESS_TOKEN_URI + 'oauth_verifier=' + oauth_verifier + "&oauth_token=" + oauth_token, "POST") Where TW_ACCESS_TOKEN_URI is https://api.twitter.com/oauth/access_token Final step is to get our user information resp, content = client.request("https://api.twitter.com/1.1/users/show.json? screen_name=" + access_token["screen_name"] + "&user_id=" + access_token["user_id"] , "GET") user_info = json.loads(content) In an user_info variable you can get a profile picture or a profile name. Summarizing, oauth protocol is very secure and easy to use by developer. At the beginning an oauth flow can seem to be a little hard to  understand but if you spend some time trying tp understand it, everything becomes easier.  And it’s secured. because you don’t need to store a login or a password, and an access token has an expired time. This is the main feature of Oauth protocol.

Continue ReadingTwitter Oauth

GET and POST requests

If you wonder how to get or update page resource, you have to read this article. It’s trivial if you have basic knowledge about HTTP protocol. I’d like to get you little involved to this subject. So GET and POST are most useful methods in HTTP protocol. What is HTTP? Hypertext transfer protocol - allow us to communicate between client and server side. In Open Event project we use web browser as client and for now we use Heroku for server side. Difference between GET and POST methods GET - it allows to get data from specified resources POST - it allows to submit new data to specified resources for example by html form. GET samples: For example we use it to get details about event curl http://open-event-dev.herokuapp.com/api/v2/events/95 Response from server: Of course you can use this for another needs, If you are a poker player I suppose that you’d like to know how many percentage you have on hand. curl http://www.propokertools.com/simulations/show?g=he&s=generic&b&d&h1=AA&h2=KK&h3&h4&h5&h6&_ POST samples: curl -X POST https://example.com/resource.cgi You can often find this action in a contact page or in a login page. How does request look in python? We use Requests library to communication between client and server side. It’s very readable for developers. You can find great documentation  and a lot of code samples on their website. It’s very important to see how it works. >>> r = requests.get('https://api.github.com/user', auth=('user', 'pass')) >>> r.status_code 200 I know that samples are very important, but take a look how Requests library fulfils our requirements in 100%. We have decided to use it because we would like to communicate between android app generator and orga server application. We have needed to send request with params(email, app_name, and api of event url) by post method to android generator resource. It executes the process of sending an email - a package of android application to a provided email address. data = { "email": login.current_user.email, "app_name": self.app_name, "endpoint": request.url_root + "api/v2/events/" + str(self.event.id) } r = requests.post(self.app_link, json=data)  

Continue ReadingGET and POST requests

Programmer principles

As programmers we develop our programming skills and learn something every single day. We write code and solve many troubles. But is our aim to simply write code? I am sure it is not. I think writing code just for doing it is not interesting, and it’s definitely not Open Event team’s objective. Personally, I like reading code like a poem. We should always try to eliminate bad practises and ugly code. There are a few principles how to do it. Let me share them with you now. SOLID principle SOLID  is a mnemonic acronym introduced by Michael Feathers, and it simply means five basic principles of object oriented programming. These principles, when applied together, make it more likely that a programmer will create a system that is easy to maintain and extend over time. They are guidelines that can be applied while working on software to remove code smells by causing the programmer to refactor the software's source code.  It is also a part of an overall strategy of agile. So, here they are: S - Single responsibility principle This principle means that there should never be more than one reason for a class to change. In other words, a class should have only one potential change in a software's specification. You should not add everything into your class. The best practise here is to check if the logic you are introducing should be in this class or not. Responsibility is the heart of this principle, so to rephrase there should never be more than one responsibility per class. Use layers for a help. And try to divide big classes into smaller ones. O - Open/closed principle Software entities like classes, module and functions should be open for extension, but closed for modification. All of them should be private by default. To make an object behaving differently without modifying it use abstractions, or place behavior(responsibility) in derivative classes. If properties of the abstracted class need to be compared or organized together, another abstraction should handle this. This is the basis of the "keep all object variables private" argument. L - Liskov substitution principle Functions that use pointers or references to base classes have to be able to use objects of derived classes without knowing/alerting the correctness of a program A great example you can find here. If you are using a method defined at a base class upon an abstracted class, the function must be implemented properly on the subtype class. A great example provided here http://williamdurand.fr/2013/07/30/from-stupid-to-solid-code/  you can find below. “ A rectangle is a plane figure with four right angles. It has a width, and a height. Now, take a look at the following pseudo-code: rect = new Rectangle(); rect.width  = 10; rect.height = 20; assert 10 == rect.width assert 20 == rect.height We simply set a width and a height on a Rectangle instance, and then we assert that both properties are correct. So far, so good. Now we can improve our definition by saying that…

Continue ReadingProgrammer principles

Can solving lint bugs be interesting?

Today I am going to present you how we’ve changed monotonous solving bugs into motivating process. PEP Most developers need to improve their code quality. To do  that they can use style guide for e.g for Python code (PEP). PEP contains an index of all Python Enhancement Proposals. Below you can find which logs PEP returned in a command line. Do you think that this logs’ presentation is  good enough to interest a developer? Will he solve these  thousands of bugs? Undoubtedly, there are much information about errors and warnings so PEP returns long logs. But developer can not even know how to start solving bugs. And even if she/he finally starts, after each commit he/she needs to run that script again to check if quantity of bugs are increased or decreased. It seems to be endless, exhausting and very monotonous.  Nobody is encouraged to do it. Quality monitoring Open Event team wants to increase our productivity and code quality. Therefore we use a tool which allow us to check code style, security, duplication complexity and test coverage on every commit. That tool is Codacy and it fulfils our requirements in 100%. It is very helpful because it adds comments to pull requests and enables developer quickly find where a bug is located. It’s very comfortable, because you don’t need to check issues in above awful logs results. Take a look how it looks in Codacy. Isn’t it clear? Of course that it’s. Codacy shows in which line issue ocurres and which type of issue it’s. Awesome statistics dashboard I’d like to give an answer how you can engage your team to solve issues and make this process more interesting. On the main page codacy tool welcomes you with great statistics about your project. You can see number of issues, category like code complexity, code style, compatibility, documentation, error prone, performance, security and unused code. That params show in which stage of code quality your project is. I think that every developer’s aim is to have the highest code quality and increasing these statistics. But if project has many issues, developer sees only a few changes in project charts. Define Goals Recently I’ve discovered how you can motivate yourself more. You can define a goal which you’d like achive. It can be goal of category or goal of file. For example Open Event team has defined goal for a specific file to achieve. If you define small separate goals, you can quicker see the results of your work. On the left sidebar you can find a item which is named “Goals”. In this area you can easily add your projects goals. Everything is user friendly so you shouldn’t have a problem  to create own goals.

Continue ReadingCan solving lint bugs be interesting?

Unit Testing

There are many stories about unit testing. Developers sometimes say that they don’t write tests because they write a good quality code. Does it make sense, if no one is infallible?. At studies only a  few teachers talk about unit testing, but they only show basic examples of unit testing. They require to write a few tests to finish final project, but nobody really  teaches us the importance of unit testing. I have also always wondered what benefits can it bring. As time is a really important factor in our work it often happens that we simply resign of this part of process development to get “more time” rather than spend time on writing stupid tests. But now I know that it is a vicious circle. Customers requierments does not help us. They put a high pressure to see visible results not a few statistics about coverage status. None of them cares about some strange numbers. So, as I mentioned above, we usually focuses on building new features and get riid of tests. It may seem to save time, but it doesn’t. In reality tests save us a lot of time because we can identify and fix bugs very quickly. If a bug ocurrs because someone’s change we don’t have to spend long hours trying to figure out wgat is going out. That’s why we need tests.   It is especially visible in huge open source projects. FOSSASIA organization has about 200 contributors. In OpenEvent project we have about 20 active developers, who generate many lines of code every single day. Many of them change over and over again as well as interfere  with each other. Let me provide you with a simple example. In our team we have about 7 pull requests per day. As I mentioned above we want to make our code high quality and free of bugs, but without testing identifying if pull request causes a bug is very difficult task. But fortunately this boring job makes Travis CI for us. It is a great tool which uses our tests and runs them on every PR  to check if bugs occur. It helps us to quickly notice bugs and maintain our project very well. What is unit testing? Unit testing is a software development method in which the smallest testable parts of an application are tested Why do we need writing unit tests? Let me point all arguments why unit testing is really important while developing a project. To prove that our code works properly If developer adds another condition, test checks if method returns correct results. You simply don’t need to wonder if something is wrong with you code. To reduce amount of bugs It let you to know what inputs params’ function should get and what results should be returned. You simply don’t  write unused code To save development time Developers don’t waste time on checking every code’s change if his code works correctly Unit tests help to understand software design To provide quick feedback…

Continue ReadingUnit Testing

Google Maps Api

OpenEvent uses it everywhere. Let me explain it. The first problem that we faced was user current location. We wanted to get location based on geolocation method then display this results on the map. To get geolocation we use HTML5. Take a look on geolocate() function   function geolocate() {        if (navigator.geolocation) {            navigator.geolocation.getCurrentPosition(function (position) {            }        }    }   From variable position you can get longitude and latitude params. These values allow us to move marker on the map on right position and get the name of user current location. Based on these data we are able to find the closest events and display it in a distance order. To get information about city or country location you have to execute a simple GET request to google MAPS. In that case you need:   curl http://maps.googleapis.com/maps/api/geocode/json?latlng=17.0112,15.06   above result returns json file where you can find name of location: Nguigmi, Niger   Then, we faced a new challenge- we had to choose which map would be better for OpenEvent - Open Street Map or Google Maps. Finally we have chosen google maps because it wa more comfortable for our team.   OpenEvent simple searching engine is based on latitude and longitude params. So we transform all requests which contain city or country names to longitude and latitude params using Google Api. It allows us to avoid having problems with different locations’ names which occur in different nationalities.  

Continue ReadingGoogle Maps Api
Read more about the article How can you get an access to Instagram API?

How can you get an access to Instagram API?

First of all you need to know that Instagram API uses OAuth 2.0 protocol. OAuth 2.0 provides a specific authorization flow for web apps, desktop apps and mobile apps. Instagram requires authentication before getting information from their API, but don't be afraid it's very simple. Pre Requirements: Created account in Instagram Registered Client(You can create your own client here) Requirements: CLIENT_ID -79e1a142dbeabd57a3308c52ad43e31d CLIENT_SECRET -34a6834081c44c20bd11e0a112a6adg1 REDIRECT_URI - http://127.0.0.1:8001/iCallback You can get above information from https://www.instagram.com/developer/clients/manage/ CODE - You need to open page https://api.instagram.com/oauth/authorize/?client_id=CLIENT-ID&redirect_uri=REDIRECT-URI&response_type=code https://api.instagram.com/oauth/authorize/?client_id=79e1a142dbeabd57a3308c52ad43e31d&redirect_uri=http://127.0.0.1:8001/iCallback&response_type=code You will be redirected to http://your-redirect-uri?code=CODE In my case it looks like this: http://127.0.0.1:8001/iCallback?code=2e122f3d76e8125b8b4982f16ed623c2 Now we have all information to get access token! curl -F 'client_id=CLIENT_ID' -F 'client_secret=CLIENT_SECRET' -F 'grant_type=authorization_code' -F 'redirect_uri=REDIRECT_URI' -F 'code=CODE' https://api.instagram.com/oauth/access_token if everything is ok you should receive { "access_token": "fb2e77d.47a0479900504cb3ab4a1f626d174d2d", "user": { "id": "1574083", "username": "rafal_kowalski", "full_name": "Rafal Kowalski", "profile_picture": "..." } }  In Open Event we used it to get all media from instagram - to use it  as for example a background in an event details' page curl 'https://api.instagram.com/v1/users/self/media/recent/?access_token=ACCESS_TOKEN'  

Continue ReadingHow can you get an access to Instagram API?

How can you add a bug?

It's very simple to start testing, You don't need any special experience in testing area.To start testing in Open Event project you need to open our web application http://open-event.herokuapp.com/ and you can start.Isn't it easy? So You should focus on finding as many bugs as possible to provide your users with perfectly working software. If you find a bug you need to describe many details How can you report a bug to Open Event? Github (Open-Event)  - Go to Github page issues, click new issue(green button). Our Requirements: Good description - If you found a bug you have to reproduce it, so you have nice background to describe it very well. It's important because, good issue's description saves developers time. They don't need to ask announcer about details of bug. The best description which tester can add is how developer can simply achieve a bug step by step. Logs - description is sometimes not enough so you need to attach logs which are generated from our server(It's nice if you have access, if you don't have ask me) Pictures - it's helpful, because we can quickly find where bug is located Labels - You need to assign  label to issue That's all!  

Continue ReadingHow can you add a bug?