summaryrefslogtreecommitdiff
path: root/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
diff options
context:
space:
mode:
Diffstat (limited to 'docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html')
-rw-r--r--docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html91
1 files changed, 62 insertions, 29 deletions
diff --git a/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html b/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
index 28392e8..68a4c25 100644
--- a/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
+++ b/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
@@ -2,14 +2,27 @@
<html lang="en">
<head>
- <link rel="stylesheet" href="https://unpkg.com/latex.css/style.min.css" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta http-equiv="content-type" content="text/html; charset=utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
+ <meta name="theme-color" content="#6a9fb5">
+
+ <title>Cheminformatics on the Web (2021)</title>
+
+ <!--
+ <link rel="stylesheet" href="https://unpkg.com/latex.css/style.min.css" />
+ -->
+
+ <link rel="stylesheet" href="/assets/c-hyde.css" />
+
+ <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700|Abril+Fatface">
+
<link rel="stylesheet" href="/assets/main.css" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Cheminformatics on the Web (2021)</title>
<meta name="og:site_name" content="Navan Chauhan" />
<link rel="canonical" href="https://web.navan.dev/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html" />
- <meta name="twitter:url" content="https://web.navan.dev/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html />
+ <meta name="twitter:url" content="https://web.navan.dev/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html" />
<meta name="og:url" content="https://web.navan.dev/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html" />
<meta name="twitter:title" content="Cheminformatics on the Web (2021)" />
<meta name="og:title" content="Cheminformatics on the Web (2021)" />
@@ -26,24 +39,43 @@
<script data-goatcounter="https://navanchauhan.goatcounter.com/count"
async src="//gc.zgo.at/count.js"></script>
<script defer data-domain="web.navan.dev" src="https://plausible.io/js/plausible.js"></script>
- <link rel="manifest" href="manifest.json" />
+ <link rel="manifest" href="/manifest.json" />
</head>
-<body>
- <center><nav style="display: block;">
-|
-<a href="/">home</a> |
-<a href="/about/">about/links</a> |
-<a href="/posts/">posts</a> |
-<!--<a href="/publications/">publications</a> |-->
-<!--<a href="/repo/">iOS repo</a> |-->
-<a href="/feed.rss">RSS Feed</a> |
-</nav>
-</center>
+<body class="theme-base-0d">
+ <div class="sidebar">
+ <div class="container sidebar-sticky">
+ <div class="sidebar-about">
+ <h1><a href="/">Navan</a></h1>
+ <p class="lead" id="random-lead">Alea iacta est.</p>
+ </div>
+
+ <ul class="sidebar-nav">
+ <li><a class="sidebar-nav-item" href="/about/">about/links</a></li>
+ <li><a class="sidebar-nav-item" href="/posts/">posts</a></li>
+ <li><a class="sidebar-nav-item" href="/3D-Designs/">3D designs</a></li>
+ <li><a class="sidebar-nav-item" href="/feed.rss">RSS Feed</a></li>
+ <li><a class="sidebar-nav-item" href="/colophon/">colophon</a></li>
+ </ul>
+ <div class="copyright"><p>&copy; 2019-2024. Navan Chauhan <br> <a href="/feed.rss">RSS</a></p></div>
+ </div>
+</div>
+
+<script>
+let phrases = [
+ "Something Funny", "Veni, vidi, vici", "Alea iacta est", "In vino veritas", "Acta, non verba", "Castigat ridendo mores",
+ "Cui bono?", "Memento vivere", "अहम् ब्रह्मास्मि", "अनुगच्छतु प्रवाहं", "चरन्मार्गान्विजानाति", "coq de cheval", "我愛啤酒"
+ ];
+
+let new_phrase = phrases[Math.floor(Math.random()*phrases.length)];
+
+let lead = document.getElementById("random-lead");
+lead.innerText = new_phrase;
+</script>
+ <div class="content container">
-<main>
-
- <h1>Cheminformatics on the Web (2021)</h1>
+ <div class="post">
+ <h1 id="cheminformatics-on-the-web-2021">Cheminformatics on the Web (2021)</h1>
<p>Here, I have compiled a list of some libraries and possible ideas.
I, personally, like static websites which don't require a server side application and can be hosted on platforms like GitHub Pages.
@@ -51,12 +83,12 @@ Or, just by opening the HTML file and running it in your browser.
WebAssembly (Wasm) has made running code written for other platforms on the web relatively easier.
Combine Wasm with some pure JavaScript libraries, and you get a platform to quickly amp up your speed in some common tasks.</p>
-<h2>RDKit</h2>
+<h2 id="rdkit">RDKit</h2>
<p>RDKit bundles a minimal JavaScript Wrapper in their core RDKit suite.
This is perfect for generating 2D Figures (HTML5 Canva/SVGs), Canonical SMILES, Descriptors e.t.c</p>
-<h3>Substructure Matching</h3>
+<h3 id="substructure-matching">Substructure Matching</h3>
<p>This can be used to flag undesirable functional groups in a given compound.
Create a simple key:value pairs of name:SMARTS and use it to highlight substructure matches.
@@ -64,13 +96,13 @@ Thus, something like PostEra's Medicinal Chemistry Alert can be done with RDKit-
<p><img src="/assets/posts/cheminformatics-web/postera-demo.png" alt="PostEra Demo" /></p>
-<h3>Computing Properties</h3>
+<h3 id="computing-properties">Computing Properties</h3>
<p>This is useful to calculate basic properties of a given compound.</p>
<p><img src="/assets/posts/cheminformatics-web/rdkit-demo.png" alt="RDKit-JS Demo" /></p>
-<h2>Webina - Molecular Docking</h2>
+<h2 id="webina-molecular-docking">Webina - Molecular Docking</h2>
<p>Webina is a JavaScript/Wasm library that runs AutoDock Vina, which can enable you to run Molecular Docking straight in the browser itself.</p>
@@ -82,7 +114,7 @@ Due to Spectre, this feature was disabled on all browsers.
Currently, only Chromium-based and Firefox browsers have reimplemented and enabled it.
Hopefully, soon, this will be again supported by all major browsers.</p>
-<h2>Machine Learning</h2>
+<h2 id="machine-learning">Machine Learning</h2>
<p>Frameworks have now evolved enough to allow exporting models to be able to run them through JavaScript/Wasm backend.
An example task can be <strong>NER</strong> or Named-entity Recognition.
@@ -92,12 +124,12 @@ Another example is target-prediction right in the browser: <a rel="noopener" tar
<p>CHEMBL Group is first training the model using PyTorch (A Python ML Library), then converting it to the ONNX runtime.
A model like this can be directly implemented in TensorFlow, and then exported to be able to run with TensorFlow.js</p>
-<h2>Cheminfo-to-web</h2>
+<h2 id="cheminfo-to-web">Cheminfo-to-web</h2>
<p>The project aims to port cheminformatics libraries into JavaScript via Emscripten.
They have ported InChI, Indigo, OpenBabel, and OpenMD</p>
-<h3>Kekule.js</h3>
+<h3 id="kekulejs">Kekule.js</h3>
<p>It is written by @partridgejiang, who is behind the Cheminfo-to-web project</p>
@@ -105,19 +137,19 @@ They have ported InChI, Indigo, OpenBabel, and OpenMD</p>
<p>It is molecule-centric, focusing on providing the ability to represent, draw, edit, compare and search molecule structures on web browsers.</p>
</blockquote>
-<h2>Browser Extensions</h2>
+<h2 id="browser-extensions">Browser Extensions</h2>
<p>The previous machine learning examples can be packaged as browser-extensions to perform tasks on the article you are reading.
With iOS 15 bringing WebExtensions to iOS/iPadOS, the same browser extension source code can be now used on Desktop and Mobile Phones.
You can quickly create an extension to convert PDB codes into links to RCSB, highlight SMILES, highlight output of NER models, e.t.c</p>
-<h2>Conclusion</h2>
+<h2 id="conclusion">Conclusion</h2>
<p>I have not even touched all the bases of cheminformatics for the web here.
There is still a lot more to unpack.
Hopefully, this encourages you to explore the world of cheminformatics on the web.</p>
-<h2>Further Reading</h2>
+<h2 id="further-reading">Further Reading</h2>
<p><a rel="noopener" target="_blank" href="https://blueobelisk.github.io/greasemonkey.html">Blueobelisk Userscripts</a></p>
@@ -125,14 +157,15 @@ Hopefully, this encourages you to explore the world of cheminformatics on the we
<p><a rel="noopener" target="_blank" href="https://unpkg.com/@rdkit/rdkit@2021.3.3/Code/MinimalLib/dist/GettingStartedInJS.html">Getting Started with RDKit-JS</a></p>
+ </div>
<blockquote>If you have scrolled this far, consider subscribing to my mailing list <a href="https://listmonk.navan.dev/subscription/form">here.</a> You can subscribe to either a specific type of post you are interested in, or subscribe to everything with the "Everything" list.</blockquote>
<script data-isso="https://comments.navan.dev/"
src="https://comments.navan.dev/js/embed.min.js"></script>
<section id="isso-thread">
<noscript>Javascript needs to be activated to view comments.</noscript>
</section>
-</main>
+ </div>
<script src="assets/manup.min.js"></script>
<script src="/pwabuilder-sw-register.js"></script>
</body>