API:Article ideas generator

Overview
In this tutorial, you will get a demo of an article ideas generator app that suggests articles from various categories that don't yet exist on English Wikipedia. Download the code from GitHub Browse the app on Toolforge

This tutorial will teach you how to do this using:


 * Python and Flask framework
 * 1>Special:MyLanguage/API:Main page|MediaWiki Action API's 2>Special:MyLanguage/API:Parsing wikitext|Parse and 3>Special:MyLanguage/API:Links|Links module

A step-by-step process to building this application:

Step 1: Set up Python and Flask development environment
To set up the Python development environment for a Flask application, you will need to install Python, create a virtual environment and install Flask.

1>pythoninfo:Python2orPython3|Learn more about the differences between Python2 and Python3 here. To install Python3 on your local machine, follow step-by-step instructions in these [https://docs.python-guide.org/starting/installation/#python-3-installation-guides installation guides].

Here is how to set up the development environment for building the application:

Render a simple static page
Place the following code in  

Drop this one line of code   in a HTML file inside the   folder:

Next run your Flask app with the command <tvar|1> </> and open <tvar|2> </> to view your app in the browser. You should be able to see "<tvar|1>Article ideas generator</>" in your browser window.

Style your app
Let's do some app styling. To do so, add link tags to load an external and internal stylesheet. External stylesheet, in this case, is the URL of a CSS file for a Google Font <tvar|1> </>.

Replace the existing code in <tvar|1> </> with the following:

Place the following code in <tvar|1> </>

Application layout
$HOME/article-ideas-generator ├── templates/ │  └── articles.html ├── static/ │  └── static.css ├── articles.py └── venv/

Step 3: Fetch page sections from <tvar|1>Wikipedia:Requested articles</>
Let's write some code in a <tvar|1> </> function in <tvar|2> </> to fetch page sections from <tvar|3>Wikipedia:Requested articles</>. This function takes page name as an argument and makes a <tvar|1> </> request to the Action API to parse sections of the page. API call consists of an endpoint <tvar|1> </> and query string parameters. Some of the key parameters are:


 * - module to parse content on a page
 * - page title to parse
 * - tells which piece of information to retrieve, in this example it is sections

.

Next, extend the Python Flask route <tvar|1> </> in <tvar|2> </> to call the function defined above and also pass the results returned by the function to <tvar|3> </>.

Place the following <tvar|1>Jinja</> template code in <tvar|2> </>. It dynamically renders an array of buttons with help from page sections data as categories obtained via the API above.

Place the following code in <tvar|1> </> for button styling.

Step 4: Get more sections based on user selection
Based on a category or section user chooses in the previous step, fetch subsections from <tvar|1>Wikipedia:Requested articles</>. Extend the Python Flask route <tvar|1> </> in <tvar|2> </> to handle POST requests. You can do so by adding both <tvar|1> </> and <tvar|2> </> in the <tvar|3> </> argument list in the route decorator. You can then obtain category selection available in a <tvar|1> </> format from the <tvar|2> </> object, which is passed to <tvar|3> </> function for further processing.

Step 5: Collect and display articles with missing links
Let's write some code in a <tvar|1> </> function in <tvar|2> </> to fetch around 20 articles with missing links on a page. This 1function takes page name as an argument and makes a <tvar|1> </> request to the Action API and return all links embedded on the provided page. From further extraction, you can obtain those links that are missing and don't yet exist on English Wikipedia. API call consists of an endpoint <tvar|1> </> and query string parameters. Some of the key parameters are:


 * - module to query information
 * - page title to collect links
 * - query module's submodule <tvar|1> </> used as a 2>Special:MyLanguage/API:Query#Generators</>|generator module to get a set of links embedded on a page
 * - number of links to fetch

{{Note|1= For more information on the parse module, see <tvar|1>{{ll|API:Links}}</>.

Next, extend the <tvar|1> </> block concerning the <tvar|2> </> method in <tvar|3> </> route in <tvar|4> </> to call the <tvar|5> </> function if the page from which the request is obtained is of type <tvar|6> </>.

Place the following <tvar|1>Jinja</> template code in. It dynamically renders a list of links with help from the data obtained via the API above.

View complete Python, CSS and HTML code.

{{Collapse top|$HOME/article-ideas-generator/articles.py}} {{Collapse bottom}}

{{Collapse top|$HOME/article-ideas-generator/static/style.css}} {{Collapse bottom}}

{{Collapse top|$HOME/article-ideas-generator/templates/articles.html}} {{Collapse bottom}}

Next steps

 * Contribute a demo app that you have developed using the MediaWiki API to this [<tvar|url>https://github.com/wikimedia/MediaWiki-Action-API-Code-Samples</> code samples repository].