⚓ T202949 Compile the frequently used webpage design snippets for Tools authors
Page MenuHomePhabricator

Compile the frequently used webpage design snippets for Tools authors
Open, LowPublic

Description

There are a variety of design elements in Tool pages, that it might be useful to compile somewhere, so that Tool-authors don't reinvent the wheel. I.e.

  • Header and Footer blocks that can easily be customized.
  • Links & UI for things such as:
    • Source
    • Feedback
    • Documentation
    • Translations
    • Language-options
    • Tool-author's name
    • Code-License
    • Toolforge/Cloud VPS logo
    • Terms of Use
    • Privacy Policy
    • etc...?

For example

Event Timeline

Ooo, https://github.com/lucaswerkmeister/cookiecutter-toolforge now exists. "A cookiecutter template for Wikimedia Toolforge tools using the Flask Python framework." -- (found via https://www.wikidata.org/wiki/Wikidata:Sixth_Birthday -Thank you @Lucas_Werkmeister_WMDE !!!)

Perhaps this could be usefully added here? https://wikitech.wikimedia.org/wiki/Help:Toolforge/My_first_Flask_OAuth_tool
or is there anything else that needs to be done beforehand?

Is there an efficient way to make the components of this template to be sharable with tools that use other frameworks? (IANADev; that might be an obvious or naive question!)

(replying from my private account since this is only a private project so far, though who knows what will happen in the future)

is there anything else that needs to be done beforehand?

Ideally someone would try out the thing and tell me if it works :) but I also plan to do that as part of a workshop at 35c3, so I’ll probably find out in about a month where the template is lacking something.

After that, it could be added to the guide on Toolforge you mentioned (which is also what I followed before writing the template – thanks to everyone who worked on it!), but I’m not sure where it should be on the page, because I’m currently not sure what the target audience for the template is: is it for experienced tool authors, who already know their way around Toolforge and Flask and just need some assistance with the boilerplate, or is it (also) for new tool authors, who aren’t yet familiar with the various steps which the template asks of them?

When I started with the template, I was mostly thinking of experienced tool authors, but it would probably be nice if it could help new people as well – but I don’t know if the template is good enough for that, if its instructions are sufficiently clear and complete, where others might be confused, and so on. (In fact, just writing this, I realize that new users would need a “create your Wikimedia developer account” step – currently, the template assumes you already have one.)

I’m not sure how much of the template could be shared outside of it – it would be nice to unify the HTML markup across different tools, but the version in the template is specific to the Flask framework (or others which use the Jinja2 templating engine). But it should at least be possible to extract some version of the HTML into some kind of shared repository, and keep them in sync manually.

But also – I wrote this template without knowing anything about this task, or looking much at other tools’ HTML, so perhaps someone has improvement suggestions for the HTML in the template?

aborrero moved this task from Backlog to Feature requests on the Toolforge board.
aborrero subscribed.

Removing the cloud-services-team (Kanban) tag since I don't think we the SREs in the WMCS team have a lot of action items here.

Hi!
As for me, I am newbie here and searching hard for an existing tool (Python/Flask, access to wiki database, html + json REST API) to use it as an ideal example to copy-paste everything.

I know Magnus tools are nice-looking but they are all PHP (or something C++/Rust), and is not the case for me. For some reason PHP is not good for my tool and I decided to use Python.

I'd like my tool to have a common and regular Toolforge's style but does this thing exist?

@Nirvanchik Hey there! Have you looked at https://wikitech.wikimedia.org/wiki/Help:Toolforge/My_first_Flask_OAuth_tool that is mentioned in the comments above? This tutorial is based on a demo application, the source of which is here https://phabricator.wikimedia.org/source/tool-my-first-flask-oauth-tool/ and the tool itself is hosted here: https://tools.wmflabs.org/my-first-flask-oauth-tool/.

Then, there are also a few demo apps (that were developed for demonstrating the use of Action API) hosted on Toolforge. They are linked from https://tools.wmflabs.org/apps-gallery/. You could look into "Nearby Places Viewer" to begin with that has a tutorial here https://www.mediawiki.org/wiki/API:Nearby_places_viewer.

There is also https://github.com/lucaswerkmeister/cookiecutter-toolforge (mentioned in the comments above), which is a perfect example of a template that can be copy-pasted for a new tool (close to what you need). From what I understand, this solution needs to be tested first before recommending to others. Hope this helps a bit!