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

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


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

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

You can find a similar example in its repository.


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 .