Creating your own Habr application has already become a tradition among Habruzers. I decided to keep up and make my own.
In this article, I will first of all talk about how the client for Habr was created, architectural and technical solutions, their prerequisites and analysis, what difficulties were there, and last of all about the functionality of the application.
Background
It all started with a friend's suggestion to try Flutter, but I didn't mind.
, ? , , - ( ).
React+TypeScript VanilaJs, React Flutter.
, html , — , “”: html , - web-view. , .
- . , Dart , , ( Flutter : , .. , ui ).
:
ui
habr-storage - , , .
habr-api - http .
, . MVVM.
UI
API html js . html .
html Flutter, , :
web-view
( Flutter)
, , React Native, .
HTML
, , . iframe, , web-view. , , , . , .
:
, .. .
html , , .
. html, div, . , , .. html, css . , - , " ".
html :
<div class="spoiler" role="button" tabindex="0">
<b class="spoiler_title"> </b>
<div class="spoiler_text"> </div>
</div>
, details - .
2 :
html
html5. , :
( )
-
( /)
-
-
Iframe
-
-
- . , .
Flutter RecyclerView Android, ListView. ( ), .
, : . - - , .. .
, - , , - , "" . , ui , ListView , N , , N .
, 1000 - , - .
. , . , . , , - ListView "" , . , .
Habr-API
m.habr.com/kek/v2/
API:
, , , , , , , - , , . , . – API .
, API - . , API , . - .
Habr-Storage
Moor (Room, Dart) SQLite, - , . – Hive, NoSQL Key-Value , . , ( ), , .
SQLite html , (, ) , Hive. .
SQLite. . url, , path . Path - url` . :
path = str(hash(url)) + str(datetime.now().millisecondsSinceEpoch)
Isolates
Dart , , , web-workers Isolate. , HTTP , JSON, , Flutter.
- , -.
: Flutter . compute.
– , , . :
. compute, , , , .
. , , , middle, , , , , . .
:
For the parsing and preprocessing operation, I still use the compute method.
Conclusion
This is basically all that I would like to tell about the internal structure of the application.
I did not intend this post as an advertisement, but the desire to poke the application and see the code may arise, so I attach a link to github .
And then a couple of screenshots of the application:
