Flutter - How to parse data from a website to a list view

Question

I'm looking for help with my test app to provide a news feed that parses it's data from a website, namely VMoneyNews (I have their permission to use their data).

I aim for this to parse the article title, main article text and article image of each article in the Bitcoin News category for implementation into the listView, in this case a horizontal listViewRow.

Please don't include the header text in bold at the top of each article, or the link to similar articles.

Could someone please provide this code for me? I assume this will be using the HTML dependency but I just don't know where to start implementing this feature.

Thank you.

Solution 1

i created a full application that shows how to parse HTML and extract data from it you can find it here but the idea is simple :

1.import this 3 libraries for html parsing

import 'package:http/http.dart' as http;
import 'package:html/parser.dart' as parser;
import 'package:html/dom.dart' as dom;

2.get the data from the page you want

Future<List<String>> getData() async { 
  http.Response response = await http.get('website');
}

3.extract the data from the website

dom.Document document = parser.parse(response.body);

4. depend on your need let's say you want to get all element with the article tag

document.getElementsByTagName('article')

and then you can iterate throw all article using for-each and do the same to get the data inside the article . also consider making a model class for the article so you can mangle that easily later on

Solution 2

Web Scraping in dart is easy now! Just check web_scraper package on pub.

Using this package you can scrape the website's HTML tags data into simple lists & maps.

You can find a similar example in its repository.

Solution 3

I think a clean solution is to do those stuff on the backend if possible , if you use nodejs as your backend , you may think of casperJs or phantomJs , to parse the html DOM and extract data and return a clean json data to the mobile app .