Last Week, I started a project Crypto News App
The aim of the application is to fetch news feed from preferred blogs and display on the application. it is structured in such a way that you can scroll through them like you would do on your social media timeline. It also leverages you the ability to read any of these news, right there on the app without having to open another browser application.
I have been working on it since then, and there have been some good updates - Both bug fixes and New features.
If you would rather just test the new update and not bother about the technical explanations, download the Android apk - https://drive.google.com/file/d/1stZGDHcR2Xmp1szvjtwDFjkLEsgaaFg7/view?usp=sharing
Updates and New Features
- In the previous version, the list view was very unresponsive. Partly due to the fact that the application was running a lot of processes and the number of results returned was much. Also, the "excerpt" property returned in wordpress API is HTML Encoded.
Something Like this
<p>USI-Tech, a bitcoin mining company based out of the United Arab Emirates, has vowed to reopen its doors to North American users, according to an announcement sent out to participants via its website: The company’s lawyers acknowledge having regulatory issues in Texas, Washington, Minnesota and Hawaii do to the compensation structure and marketing tactics of</p>\n
In the previous version, I inputted this excerpt into a HtmlWebViewSource
<WebView>
<WebView.Source>
<HtmlWebViewSource Html="{Binding Excerpt, StringFormat='{0} ...'}" />
</WebView.Source>
</WebView>
The problem with this approach is that the renderer had to process the encoded string first, before processing it to a html format. This caused a considerable time lag.
So what I did in this new version was to strip the string of the html tags, at the point of fetching, using regular expression
blogPost.Excerpt = Regex.Replace(tempExcerpt, @"<[^>]*(>|$)| ||»|«|’", string.Empty).Trim();
and thereafter process it as a normal Xaml Label.
<Label Text="{Binding Excerpt, StringFormat='{0} ...'}" TextColor="Black" FontSize="Medium"/>
This improved the responsiveness and load time immensely.
https://github.com/Johnesan/CryptoNews/blob/master/CryptoNews/CryptoNews/Services/PostsRepository.cs
- "Pull down to refresh" functionality has also been fixed. Previously, there was an error in the code for Refreshing which caused the event to never get terminated. But that has been rectified now.
- I got some nice feedback on the application as well as some contributions. One of which was some graphic designs by
in this post
I connected with him, and he gave me the go ahead to use the designs. I added a splashscreen for the application with one of his banner designs.
https://github.com/Johnesan/CryptoNews/blob/master/CryptoNews/CryptoNews.Android/SplashActivity.cs
- I made a major adjustment to the management of blog websites. I mentioned in the initial post that the application only supports wordpress blog websites. Previously, users had to go test the website themselves to confirm if it meets the requirements before adding it to their list.
However, I got feedback from some non-technical folks that it was a Herculean task for them. So in this update, I automated the process. I added a "test button" which allowed users to input their website url and have the application automatically check if it meets the requirements before saving.
Here's how I did it:
I get the url they type into the entry and then append the wordpress API extension to it, then make a Http request to it and check if it returns a "success" status code.
https://github.com/Johnesan/CryptoNews/blob/master/CryptoNews/CryptoNews/Views/EditBlogWebsite.xaml.cs
private async void TestButtonClicked(object sender, EventArgs e)
{
.
.
.
HttpClient httpClient = new HttpClient();
httpClient.BaseAddress = new Uri(url);
httpClient.DefaultRequestHeaders.Accept.Clear();
httpClient.DefaultRequestHeaders.Accept.Add(new MediaTypeWithQualityHeaderValue("application/json"));
var response = await httpClient.GetAsync("/wp-json/wp/v2/posts?_embed");
if (response.IsSuccessStatusCode)
{
await DisplayAlert("Successful", "This Website has been tested and it meets the requirements to fetch its blog feed. You can now save it", "Ok");
SaveButton.IsEnabled = true;
.
.
.
}
else
{
await DisplayAlert("Failed", "This Website does not meet the requirements so this application cannot fetch its feed.", "Ok");
.
.
.
}
}
I have ignored unrelated code in this block, just to show the exact code that performs this check
- After considering UX, I decided to make some changes to the time feed. Some of the selected blog websites publish more than one post a day. Previously, all posts for the day appear with the date of that day. It becomes a problem trying to ascertain how recent a post is.
I added a new class to handle the calculation of the DateTime property relative to the current time. So posts now have "just now", "25mins ago", "3 hours ago", etc... instead of "31/01/2018" all through.
Previous version vs New update
Here is the class that performs that https://github.com/Johnesan/CryptoNews/blob/master/CryptoNews/CryptoNews/Services/PrettyDate.cs
- One more change I made was to replace some of the default blog websites. I discovered some of them were not so active and so I replaced them with some more active blogs.
Important Links
- Github Commit for Updates: https://github.com/Johnesan/CryptoNews/commit/653edc6b1ca1ed8b93272bf4bccc568de5c3f6ac
https://github.com/Johnesan/CryptoNews/commit/ec8e606a6bc5ff39e4b4640aa32bde0a57e4bb5e - Updated Android Apk: https://drive.google.com/file/d/1stZGDHcR2Xmp1szvjtwDFjkLEsgaaFg7/view?usp=sharing
To make your contributions, the github link again is https://github.com/Johnesan/CryptoNews
You could get in touch with me, as regards any technical comments, questions or contributions you have concerning the project- jcoool40@gmail.com
Posted on Utopian.io - Rewarding Open Source Contributors