<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: tenexcoder</title>
    <description>The latest articles on DEV Community by tenexcoder (@tenexcoder).</description>
    <link>https://dev.to/tenexcoder</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F511944%2Fe9234823-c083-4b28-a9d2-7769613d8f9c.png</url>
      <title>DEV Community: tenexcoder</title>
      <link>https://dev.to/tenexcoder</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/tenexcoder"/>
    <language>en</language>
    <item>
      <title>Reverse Engineering the Corona Virus</title>
      <dc:creator>tenexcoder</dc:creator>
      <pubDate>Wed, 09 Dec 2020 10:00:34 +0000</pubDate>
      <link>https://dev.to/tenexcoder/reverse-engineering-the-corona-virus-c2i</link>
      <guid>https://dev.to/tenexcoder/reverse-engineering-the-corona-virus-c2i</guid>
      <description>&lt;p&gt;In this post we will be analyzing the Corona Virus 2 aka SARS-CoV-2 from first principles.&lt;/p&gt;

&lt;h1&gt;
  
  
  Let’s Talk Molecular Biology
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--3XzEwT1P--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://miro.medium.com/max/512/1%2Au2wvvV4Pi2s-8cyGYlg_RQ.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--3XzEwT1P--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://miro.medium.com/max/512/1%2Au2wvvV4Pi2s-8cyGYlg_RQ.png" alt="DNA to protein"&gt;&lt;/a&gt;&lt;br&gt;
At a high level we can think of DNA as blueprints, RNA as the instructions, and Proteins as functions. From High school Biology class we can remember that DNA is made up of 4 nucleic acids guanine, adenine, cytosine and thymine; in RNA, uracil is used in place of thymine in a process called transcription. There are 20 common Amino acids each defined by a sets of three mRNA nucleotides (A, U, G and C). Proteins are a sequences of amino acid chains which fold into a specific shape to define its function.&lt;br&gt;
&lt;/p&gt;
&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;
&lt;br&gt;
Lets summarize what we learned from the interactive notebook above. We obtained both the genome and protein structure from the NCBI data bank. First we analyzed the annotation from the genome and dicover that its taxonomy is virus and that it molecular type is single stranded RNA. From there we explored its genome and throught the transcription and tranlsation process to obtain its amino acid sequence. To expedite the process we used the metadata to retrieve its protein coding sequences (CDS). 

&lt;p&gt;The 10 main CDS are A Chain of Proteins (ORF1ab), Spike Protein (S), Escape Artist (ORF3a), Envelope Protein (E), Membrane Protein (M), Signal Blocker (ORF6), Virus Liberator (ORF7a), Mystery Protein (ORF8), Nucleocapsid Protein (N), Mystery Protein (ORF10). The two important proteins to remeber are ORF1ab which funtion as the payload and S which is the exploit. The rest of the proteins assist to make everythig happen. Lastly, we visualized a 3d model of the main protein structure.&lt;/p&gt;

&lt;p&gt;For a visual walkthrough visit &lt;a href="https://www.nytimes.com/interactive/2020/04/03/science/coronavirus-genome-bad-news-wrapped-in-protein.html"&gt;The New York Times Infographic&lt;/a&gt;&lt;/p&gt;

</description>
      <category>python</category>
      <category>tutorial</category>
      <category>showdev</category>
      <category>programming</category>
    </item>
    <item>
      <title>Deploying your React app has never been simpler with Github Pages</title>
      <dc:creator>tenexcoder</dc:creator>
      <pubDate>Mon, 23 Nov 2020 23:17:54 +0000</pubDate>
      <link>https://dev.to/tenexcoder/deploying-your-react-app-has-never-been-simpler-with-github-pages-1jmi</link>
      <guid>https://dev.to/tenexcoder/deploying-your-react-app-has-never-been-simpler-with-github-pages-1jmi</guid>
      <description>&lt;p&gt;Remember the time you were trying to share progress with a client or wanted to showcase your next side projects? We all been there hoping things could be only a few clicks away.&lt;/p&gt;

&lt;p&gt;Well fear not your wishes have been granted, there is now a free and simple approach of Deploying your React apps.&lt;/p&gt;

&lt;h2&gt;
  
  
  Package: gh-pages
&lt;/h2&gt;

&lt;p&gt;I present to you &lt;a href="https://github.com/tschaub/gh-pages"&gt;gh-pages&lt;/a&gt; which I quote allows you to “Publish files to a &lt;code&gt;gh-pages&lt;/code&gt; branch on GitHub (or any other branch anywhere else).”&lt;br&gt;
The package automate the mundane step required to deploy your react app to GitHub Pages into three simple steps.&lt;br&gt;
Technically this package can help you deploy any static site as long as the base directory of the static files is set accordingly — more on this in Step 2&lt;/p&gt;
&lt;h2&gt;
  
  
  Step 1: Add &lt;code&gt;homepage&lt;/code&gt; to &lt;code&gt;package.json&lt;/code&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;em&gt;The step below is important!&lt;/em&gt;&lt;br&gt;
&lt;em&gt;If you skip it, your app will not deploy correctly.&lt;/em&gt;&lt;br&gt;
Open your &lt;code&gt;package.json&lt;/code&gt; and add a &lt;code&gt;homepage&lt;/code&gt; field for your project:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;“homepage”: “https://myusername.github.io/my-app",
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;or for a GitHub user page:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;“homepage”: “https://myusername.github.io",
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;or for a custom domain page:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;“homepage”: “https://mywebsite.com",
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Create React App uses the &lt;code&gt;homepage&lt;/code&gt; field to determine the root URL in the built HTML file.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Install &lt;code&gt;gh-pages&lt;/code&gt; and add &lt;code&gt;deploy&lt;/code&gt; to &lt;code&gt;scripts&lt;/code&gt; in &lt;code&gt;package.json&lt;/code&gt;
&lt;/h2&gt;

&lt;p&gt;Now, whenever you run npm run build, you will see a cheat sheet with instructions on how to deploy to GitHub Pages.&lt;br&gt;
To publish it at &lt;a href="https://myusername.github.io/my-app"&gt;https://myusername.github.io/my-app&lt;/a&gt;, run:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install — save gh-pages
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Alternatively you may use yarn:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;yarn add gh-pages
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Add the following scripts in your package.json:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;“scripts”: {
+ “predeploy”: “npm run build”,
+ “deploy”: “gh-pages -d build”,
“start”: “react-scripts start”,
“build”: “react-scripts build”,
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The &lt;code&gt;predeploy&lt;/code&gt; script will run automatically before deploy is run.&lt;/p&gt;

&lt;p&gt;The &lt;code&gt;deploy&lt;/code&gt; script will automagically deploy your app.&lt;/p&gt;

&lt;p&gt;Note: The &lt;code&gt;-d&lt;/code&gt; option is to point to the base directory of the static files. Set it according to your project’s configuration. For example the base directory for &lt;code&gt;create-react-app&lt;/code&gt; is &lt;code&gt;build&lt;/code&gt; by default, meanwhile for a &lt;code&gt;webpack&lt;/code&gt; configuration it is &lt;code&gt;dist&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;If you are deploying to a GitHub user page instead of a project page you’ll need to make one additional modification:&lt;br&gt;
Tweak your &lt;code&gt;package.json&lt;/code&gt; scripts to push deployments to master:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;“scripts”: {
“predeploy”: “npm run build”,
- “deploy”: “gh-pages -d build”,
+ “deploy”: “gh-pages -b master -d build”,
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Step 3: Deploy the site by running &lt;code&gt;npm run deploy&lt;/code&gt;&lt;br&gt;
Then run:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm run deploy
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  For a project page, ensure your project’s settings use &lt;code&gt;gh-pages&lt;/code&gt;
&lt;/h2&gt;

&lt;p&gt;Finally, make sure GitHub Pages option in your GitHub project settings is set to use the &lt;code&gt;gh-pages&lt;/code&gt; branch:&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--0alkkrs_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.imgur.com/HUjEr9l.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--0alkkrs_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.imgur.com/HUjEr9l.png" alt="gh-pages branch"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Optionally, configure the domain
&lt;/h2&gt;

&lt;p&gt;You can configure a custom domain with GitHub Pages by adding a &lt;code&gt;CNAME&lt;/code&gt; file to the &lt;code&gt;public/&lt;/code&gt; folder.&lt;br&gt;
Your CNAME file should look like this:&lt;br&gt;
Copy&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;mywebsite.com
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Resources
&lt;/h2&gt;

&lt;p&gt;For more details check out the repository or create react app docs which this guide was heavily based on.&lt;br&gt;
&lt;a href="https://github.com/tschaub/gh-pages"&gt;https://github.com/tschaub/gh-pages&lt;/a&gt;&lt;br&gt;
&lt;a href="https://create-react-app.dev/docs/deployment/#github-pages"&gt;https://create-react-app.dev/docs/deployment/#github-pages&lt;/a&gt;&lt;/p&gt;

</description>
      <category>react</category>
      <category>webdev</category>
      <category>javascript</category>
      <category>github</category>
    </item>
    <item>
      <title>🤗 BERT tokenizer from scratch</title>
      <dc:creator>tenexcoder</dc:creator>
      <pubDate>Wed, 11 Nov 2020 02:48:19 +0000</pubDate>
      <link>https://dev.to/tenexcoder/bert-tokenizer-from-scratch-4ma2</link>
      <guid>https://dev.to/tenexcoder/bert-tokenizer-from-scratch-4ma2</guid>
      <description>&lt;p&gt;As part of &lt;a href="https://github.com/huggingface/tokenizers"&gt;🤗 Tokenizers&lt;/a&gt; 0.9 release, it has never been easier to create extremely fast and versatile tokenizers for your next NLP task.&lt;br&gt;
No better way to showcase tokenizers' new capabilities than to create a Bert tokenizer from scratch.&lt;/p&gt;
&lt;h2&gt;
  
  
  Tokenizer
&lt;/h2&gt;

&lt;p&gt;First, BERT relies on WordPiece, so we instantiate a new &lt;a href="https://huggingface.co/docs/tokenizers/python/latest/api/reference.html#tokenizers.Tokenizer"&gt;Tokenizer&lt;/a&gt; with this model:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers import Tokenizer
from tokenizers.models import WordPiece

bert_tokenizer = Tokenizer(WordPiece())
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then we know that BERT preprocesses texts by removing accents and lowercasing. We also use a unicode normalizer:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers import normalizers
from tokenizers.normalizers import Lowercase, NFD, StripAccents

bert_tokenizer.normalizer = normalizers.Sequence([NFD(), Lowercase(), StripAccents()])
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The pre-tokenizer is just splitting on whitespace and punctuation:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers.pre_tokenizers import Whitespace

bert_tokenizer.pre_tokenizer = Whitespace()
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;And the post-processing uses the template we saw in the previous section:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers.processors import TemplateProcessing

bert_tokenizer.post_processor = TemplateProcessing(
    single="[CLS] $A [SEP]",
    pair="[CLS] $A [SEP] $B:1 [SEP]:1",
    special_tokens=[
        ("[CLS]", 1),
        ("[SEP]", 2),
    ],
)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;We can use this tokenizer and train on it on wikitext like in the &lt;a href="https://huggingface.co/docs/tokenizers/python/latest/quicktour.html"&gt;Quicktour&lt;/a&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers.trainers import WordPieceTrainer

trainer = WordPieceTrainer(
    vocab_size=30522, special_tokens=["[UNK]", "[CLS]", "[SEP]", "[PAD]", "[MASK]"]
)
files = [f"data/wikitext-103-raw/wiki.{split}.raw" for split in ["test", "train", "valid"]]
bert_tokenizer.train(trainer, files)

model_files = bert_tokenizer.model.save("data", "bert-wiki")
bert_tokenizer.model = WordPiece.from_file(*model_files, unk_token="[UNK]")

bert_tokenizer.save("data/bert-wiki.json")
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now that the BERT tokenizer has been configured and trained the BERT tokenizer, we can load it with:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers import Tokenizer

bert_tokenizer = Tokenizer.from_file("data/tokenizer-wiki.json")
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Decoding
&lt;/h2&gt;

&lt;p&gt;On top of encoding the input texts, a &lt;a href="https://huggingface.co/docs/tokenizers/python/latest/api/reference.html#tokenizers.Tokenizer"&gt;&lt;code&gt;Tokenizer&lt;/code&gt;&lt;/a&gt; also has an API for decoding, that is converting IDs generated by your model back to a text. This is done by the methods &lt;a href="https://huggingface.co/docs/tokenizers/python/latest/api/reference.html#tokenizers.Tokenizer.decode"&gt;&lt;code&gt;decode()&lt;/code&gt;&lt;/a&gt; (for one predicted text) and &lt;a href="https://huggingface.co/docs/tokenizers/python/latest/api/reference.html#tokenizers.Tokenizer.decode_batch"&gt;&lt;code&gt;decode_batch()&lt;/code&gt;&lt;/a&gt; (for a batch of predictions).&lt;br&gt;
The decoder will first convert the IDs back to tokens (using the tokenizer’s vocabulary) and remove all special tokens, then join those tokens with spaces.&lt;br&gt;
If you used a model that added special characters to represent subtokens of a given “word” (like the &lt;code&gt;"##"&lt;/code&gt; in WordPiece) you will need to customize the decoder to treat them properly. If we take our previous bert_tokenizer for instance the default decoding will give:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;output = bert_tokenizer.encode("Welcome to the 🤗 Tokenizers library.")
print(output.tokens)
# ["[CLS]", "welcome", "to", "the", "[UNK]", "tok", "##eni", "##zer", "##s", "library", ".", "[SEP]"]

bert_tokenizer.decode(output.ids)
# "welcome to the tok ##eni ##zer ##s library ."
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;But by changing it to a proper decoder, we get:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;from tokenizers import decoders

bert_tokenizer.decoder = decoders.WordPiece()
bert_tokenizer.decode(output.ids)
# "welcome to the tokenizers library."
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Resources
&lt;/h3&gt;

&lt;p&gt;Documentation: &lt;a href="https://huggingface.co/docs/tokenizers/python/latest/pipeline.html#all-together-a-bert-tokenizer-from-scratch"&gt;https://huggingface.co/docs/tokenizers/python/latest/pipeline.html#all-together-a-bert-tokenizer-from-scratch&lt;/a&gt;&lt;br&gt;
Colab: &lt;a href="https://colab.research.google.com/github/tenexcoder/huggingface-tutorials/blob/main/BERT_tokenizer_from_scratch.ipynb"&gt;https://colab.research.google.com/github/tenexcoder/huggingface-tutorials/blob/main/BERT_tokenizer_from_scratch.ipynb&lt;/a&gt;&lt;br&gt;
Gist: &lt;a href="https://gist.github.com/tenexcoder/85b38e17a5557f0bb7c44bda4a08271d"&gt;https://gist.github.com/tenexcoder/85b38e17a5557f0bb7c44bda4a08271d&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Credit
&lt;/h3&gt;

&lt;p&gt;All credit goes to Hugging Face Tokenizers Documentation — see resources for more details&lt;br&gt;
I simply packaged the example in a digestible and shareable form.&lt;/p&gt;

</description>
      <category>nlp</category>
      <category>deeplearning</category>
      <category>machinelearning</category>
      <category>opensource</category>
    </item>
  </channel>
</rss>
