Skip to main content

Frontend

The Frontend track teaches you how to create production-grade Datagrok applications. Before proceeding to exercises, make sure you are ready for it:

Complete basic exercises.

Learn the basics of TypeScript. The TypeScript handbook is a great resource for that.

Learn the CSS basics . You should be able to use Chrome's inspector (F12), understand where elements' visual properties come from, create your own CSS classes, and apply selectors.

Explore the collection of standard code snippets. Go to JS API examples, and browse and run each snippet (F5, or '>' icon on top) under the following folders:

  • /ui: components. Pay attention to the code, it is short and canonical, this is how you want to write your UI code.
  • /ux: common templates for layouts, dialogs, input blocks, interactivity, navigation, etc. Pay attention to the results of the snippet.

Set up your IDE. You want to be as productive as possible, so this is very important. Follow the steps outlined in the Setting up the environment section to make sure you can easily create, edit, and publish packages. Make sure you can debug your code with the assistance of IDE, including using breakpoints and code completion.

Know where to get help.

Exercise 1: chembl browser

... to be continued...

See also