<?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: Dali Salvador</title>
    <description>The latest articles on DEV Community by Dali Salvador (@dalisalvador).</description>
    <link>https://dev.to/dalisalvador</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%2F257733%2F1e014707-4d8c-4a42-87c4-af5252ae411a.jpeg</url>
      <title>DEV Community: Dali Salvador</title>
      <link>https://dev.to/dalisalvador</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/dalisalvador"/>
    <language>en</language>
    <item>
      <title>A simple animated timer implementing react-native-reanimated and react-native-svg libraries.</title>
      <dc:creator>Dali Salvador</dc:creator>
      <pubDate>Mon, 28 Oct 2019 09:31:42 +0000</pubDate>
      <link>https://dev.to/dalisalvador/a-simple-animated-timer-implementing-react-native-reanimated-and-react-native-svg-libraries-11b0</link>
      <guid>https://dev.to/dalisalvador/a-simple-animated-timer-implementing-react-native-reanimated-and-react-native-svg-libraries-11b0</guid>
      <description>&lt;h1&gt;
  
  
  react-native-animated-timer     ⏰
&lt;/h1&gt;

&lt;p&gt;A simple animated timer implementing &lt;a href="https://github.com/kmagiera/react-native-reanimated" rel="noopener noreferrer"&gt;react-native-reanimated&lt;/a&gt; and &lt;a href="https://github.com/react-native-community/react-native-svg" rel="noopener noreferrer"&gt;react-native-svg&lt;/a&gt; libraries.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Fxbxn60mtndm98bqrrqsv.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Fxbxn60mtndm98bqrrqsv.gif" alt="1"&gt;&lt;/a&gt;&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Fs2quvrctqbnx933ha043.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Fs2quvrctqbnx933ha043.gif" alt="2"&gt;&lt;/a&gt;&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Flqnfcqkn186vfox7g0j8.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Flqnfcqkn186vfox7g0j8.gif" alt="3"&gt;&lt;/a&gt;&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Fyj1t83n668yxxmw9xetv.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fthepracticaldev.s3.amazonaws.com%2Fi%2Fyj1t83n668yxxmw9xetv.gif" alt="4"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Usage
&lt;/h2&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;`import {Timer} from  'react-native-animated-timer';

&lt;p&gt;&amp;lt;Timer&lt;br&gt;
    radius={350}&lt;br&gt;
    time={10000}&lt;br&gt;
    checkPoints={[{time: 1210.23, callback: () =&amp;gt; alert('First Check Point')},&lt;br&gt;
                {time: 5310, callback: () =&amp;gt; alert('Second Check Point')}]}&lt;br&gt;
    backgrounds={['blue', 'red', '&lt;a href="http://myimage.com/img1.png'%5D" rel="noopener noreferrer"&gt;http://myimage.com/img1.png']&lt;/a&gt;}&lt;br&gt;
    showTime={true}&lt;br&gt;
    onTimeFinished={() =&amp;gt; alert('AnimatedTimer has finished')}&lt;br&gt;
    loop={true}&lt;br&gt;
    pause={pauseFlag}&lt;br&gt;
    textStyle={{&lt;br&gt;
        color:  'red',&lt;br&gt;
        fontWeight:  'bold',&lt;br&gt;
    }}&lt;br&gt;
    showMilli={2}&lt;br&gt;
/&amp;gt;`&lt;br&gt;
&lt;/p&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
&lt;br&gt;
  &lt;br&gt;
  &lt;br&gt;
  Full Documenation&lt;br&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://github.com/dalisalvador/react-native-animated-timer" rel="noopener noreferrer"&gt;https://github.com/dalisalvador/react-native-animated-timer&lt;/a&gt;&lt;/p&gt;

</description>
      <category>showdev</category>
      <category>reactnative</category>
      <category>npm</category>
    </item>
    <item>
      <title>Twitter Trends Heat Map</title>
      <dc:creator>Dali Salvador</dc:creator>
      <pubDate>Fri, 25 Oct 2019 08:08:25 +0000</pubDate>
      <link>https://dev.to/dalisalvador/twitter-trends-heat-map-579</link>
      <guid>https://dev.to/dalisalvador/twitter-trends-heat-map-579</guid>
      <description>&lt;h1&gt;
  
  
  TrendingMap
&lt;/h1&gt;

&lt;p&gt;Hi there! A couple of months ago I found  &lt;a href="https://www.trendsmap.com/"&gt;TrendsMap&lt;/a&gt; webapp and I really liked the solution or service they provide. However, the way they present the information it’s not really user-friendly, and most importantly, if you want a deeper analysis, you’ll have to pay.&lt;/p&gt;

&lt;p&gt;I then tried to find similar webapps, and found  &lt;a href="https://www.tweeplers.com/map/hashtags/"&gt;tweeplers&lt;/a&gt; map (which is even worse) and others not even worth mention.&lt;/p&gt;

&lt;p&gt;After a couple of hours searching, I decided that the opensource community deserves a better app, completely free and easy to use, so I started  &lt;a href="https://trendingmap.herokuapp.com/"&gt;TrendingMap&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;It consists of a very simple Node.js back-end which handles all twitterAPI requests and other simple things, and for the front-end uses React.&lt;/p&gt;

&lt;p&gt;This is just the beginning. Whenever I have time I’ll continue to improve this (luckily with your help) and hopefully, we’ll have a useful tool to analyze twitter trends.&lt;/p&gt;

&lt;h1&gt;
  
  
  DEMO &lt;a href="https://trendingmap.herokuapp.com/"&gt;https://trendingmap.herokuapp.com/&lt;/a&gt;
&lt;/h1&gt;

&lt;p&gt;The app is deployed in Heroku (free) so it might be idle, therefor it could take a couple of seconds to load.&lt;/p&gt;

</description>
      <category>react</category>
      <category>node</category>
      <category>showdev</category>
      <category>twitterapi</category>
    </item>
  </channel>
</rss>
