teleren/devto huggingface dataset:
Displaying an RSS Feed in CraftCMS
Tags: frontend, rss, craftcms
Published: 2019-07-10 15:48:43

---
title: Displaying an RSS Feed in CraftCMS
published: true
tags: frontenddevelopment,rss,craftcms
canonical_url: 
---

CraftCMS doesn’t appear to have a built-in way to display RSS feeds and more often than not, clients want to display their recent or related blog posts on their main website.

The first thing we did to tackle this challenge was install the Craft RSS plugin by [Guilty AS](https://plugins.craftcms.com/craft-rss).

The GitHub page for the plugin has an example of how to display the RSS feed in your templates and it’s pretty straight forward.

```
{% set blogFeed = craft.rss.loadRss(“https://helgesverre.com/blog/feed") %}
{% if blogFeed %}
<h1>{{ blogFeed.title }}</h1>
<a href=”{{ blogFeed.link }}”>{{ blogFeed.link }}</a>
<ul>
{% for post in blogFeed.item %}
<li><a href=”{{ post.link }}”>{{ post.title }} — {{ post.pubDate }}</a></li>
{% endfor %}
</ul>
{% endif %}
```

Just plug in your RSS Feed URL and off you go.

Naturally you’ll want to arrange the results of the feed in a way that best matches your site’s design.

You are might want to limit the number of posts you are showing. To do that we set a counter = 0 at the beginning of the block (line 2 below). Then before each “for post in blogFeed.item” loop we check if the counter is less than the number of posts we want to show (line 9). Right before the end of the loop then increment the counter with a +1 (line 17).

```
{% set blogFeed = craft.rss.loadRss(block.linkUrl) %}
{% set counter = 0 %}
{% if blogFeed %}
<h1>{{ blogFeed.title }}</h1>
<a href=”{{ blogFeed.link }}”>{{ blogFeed.link }}</a>
<ul>
{% if counter < 3 %}
{% for post in blogFeed.item %}
<li>
<a href=”{{ post.link }}”>{{ post.title }} — {{ post.pubDate }}</a><br/>
<span>{{ post.description | raw }}</span>
</li>
{% set counter = counter + 1 %}
{% endfor %}
{% endif %}
</ul>
{% endif %}
```

If you want to make this a little more flexible you could create a field in Craft to take in the URL of the blog feed, either per entry or as a global.

If you really want to get fancy you could create several different type of display options (card, list, etc) and let the user choose how they want to display the information.

ETA: I recently came back across this article while adding a feed to a client’s site. Turns out the code was a little incorrect and very annoying to not be able to copy and paste so I’m fixing those issues. You may also have to look at your feed directly to figure out what things you can pull in, in this example we had to pull in the full description as raw text rather than html in order to get the image and excerpt.

* * *
Need help cleaning up this code, which modifies the subdomain.
Tags: help
Published: 2019-07-10 16:22:57

---
title: Need help cleaning up this code, which modifies the subdomain.
published: true
tags: help
---

Goal would be to get one subdomain and swap it out for another. I feel there has to be a cleaner way to do this. help me out!

```js
var url = window.location;

// example doamin would have a subdomain so https://auth.domain.ext
var domain = url.host;
var domainParts = domain.split('.');
var mainDomainParts = domainParts.slice(domainParts.length - 2, domainParts.length);
mainDomainParts.unshift('admin');
var adminDomain = mainDomainParts.join('.');
var fullAdminDomain = url.protocol + '//' + adminDomain;
```
Daily Challenge #12 - Next Larger Number
Tags: challenge
Published: 2019-07-10 16:21:45

---
title: Daily Challenge #12 - Next Larger Number
published: true
series: Daily Challenge
description: 12th Daily Challenge for DEV.to, easy difficulty. 
tags: challenge
---
Apologies on missing yesterday's challenge.  We have a fun one to hop in on today.  If you haven't been following the series, feel free to give this one a try. If you're one of our more advanced users, consider this your rest day. 

This challenge comes from [user GiacomoSorbi on CodeWars](https://www.codewars.com/kata/next-bigger-number-with-the-same-digits)

>Your goal is to create a function that takes a positive integer and returns the next bigger number formed using the same digits. 

>A number like 2019 would not become 9210, as that is the largest possible number that can be created using those digits. The answer would be 2091, as that is the next larger number. 

>For example:
12 ==> 21
513 ==> 531

>If a larger number cannot be composed using those digits, return -1 or `null`.

Good luck, happy coding!
***
_Thank you to [CodeWars](<https://codewars.com/>), who has licensed redistribution of this challenge under the [2-Clause BSD License](<https://opensource.org/licenses/BSD-2-Clause>)!_

_Want to propose a challenge for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
Dedication! What would you do for code?
Tags: coding, fun, webdev, mentalhealth
Published: 2019-07-10 16:17:15

---
title: Dedication! What would you do for code?
published: true
description: Just a silly thing I did so I could code, what would you do?
tags: coding, fun, webdev, mentalhealth
---

My buddy just posted this in the work slack channel. Thought it was funny that i was so dedicated to my work that I would sit under a plastic tarp. 

They were sandblasting the wood rafters at work and the dust was insane, so I figured I'd make an easy solution.

![](https://thepracticaldev.s3.amazonaws.com/i/30e4k7dxy1x0lfqm9phw.png)

What silly thinks have you done to keep coding?
Looking beyond the pay (my opinion)
Tags: life, advice
Published: 2019-07-10 15:54:37

	
In today's day in age the rising of software engineering has become high in demand and more competitive than ever. Everyone in the Computer science space fights for jobs and others work hard to work anywhere they can for experience. 
	
One thing I've noticed in myself and others around me is that people within the computer science realm have this notion of seeking top companies that pay a huge starting salaries and then brag to others as if it’s a competition to obtain the highest salary job out there. I don't know why but it's gotten to me a few times since most people look down on others for not getting into top companies or getting high salaries. This shifted my thinking to look into looking at companies only for the pay and not really much else. This type of thinking isn't ideal and shouldn't be for everyone else.
 
	
I was talking to a supervisor recently about how looking for the highest salary isn't always everything in a company. Looking at the impact, the company brings to the world and seeing how your software or solution could potentially impact others is a more meaningful way to assess whether or not your time with a company will be valued. 

	
Obviously there are software companies that do low ball software developers and that's not okay but there are many companies that I've seen where the pay is substantial but the atmosphere is like having a second family. That to me has more value than having a 6 figure income right out of the gate. I am a person who works hard starting from the bottom then working my way to the top! 

	
That being said the take away from this is to anyone who is hesitant on accepting job offers that start low you should give it a second chance, and you'll be able to value the company better and will have a better chance to grow with time and more experience. (FYI obviously not companies that low ball you but start off fairly decent lol)
Daily Challenge #3 - Vowel Counter
Tags: challenge
Published: 2019-06-30 17:40:14

---
title: Daily Challenge #3 - Vowel Counter
published: true
series: Daily Challenge
description: Our daily coding challenge series, day 3.
tags: #challenge
---
Hope you’re ready for another challenge! Let’s get started with Day 3. 

Today’s challenge is modified from user [_@jayeshcp_ on CodeWars](https://www.codewars.com/kata/54ff3102c1bad923760001f3). 

>Write a function that returns the number (count) of vowels in a given string. Letters considered as vowels are: a, i, e, o, and u. The function should be able to take all types of characters as input, including lower case letters, upper case letters, symbols, and numbers. 

In this challenge, you should be able to efficiently ignore spaces and symbols and discern between capital and lowercase letters. Beginners can start with only lowercase letters and move up from there. It’ll definitely get you ready for tomorrow.

Happy coding!~
***

_Thank you to [CodeWars](https://codewars.com/), who has licensed redistribution of this challenge under the [2-Clause BSD License](https://opensource.org/licenses/BSD-2-Clause)!_

_Want to propose a challenge for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
Use Tkinter to make a Python GUI?
Tags: python, tkinter
Published: 2019-07-10 15:21:21

---
title: Use Tkinter to make a Python GUI?
published: true
description: python, tkinter
tags: python, tkinter
---
There are many GUI modules for Python. One of them is Tkinter. So what about Tkinter?

Maybe. If your program doesn't need complex GUI widgets or a native GUI.

![](https://thepracticaldev.s3.amazonaws.com/i/wavv02lsdg1903dzgw8x.jpeg)

If you need many widgets and native operating system look, it may be better to go with <a href="https://pythonprogramminglanguage.com/pyqt-tutorials">the PyQt5 module</a>.

Tkinter has been around for a long long time. It contains the basic widgets

* Button, Checkbutton, Menubutton, Radiobutton
* Canvas
* Entry
* Frame
* Label, LabelFrame
* Listbox
* Menu
... and so on.

So you can build basic GUI interfaces. But it doesn't have an enormous list of widgets.

On the other hand, it has an easy learning curve. The hello world program looks like this:

    #!/usr/bin/python3
    import tkinter as tk
    
    class Application(tk.Frame):
        def __init__(self, master=None):
            super().__init__(master)
            self.master = master
            self.pack()
            self.create_widgets()

        def create_widgets(self):
            self.hi_there = tk.Button(self)
            self.hi_there["text"] = "Hello World\n(click me)"
            self.hi_there["command"] = self.say_hi
            self.hi_there.pack(side="top")
    
            self.quit = tk.Button(self, text="QUIT", fg="red",
                              command=self.master.destroy)
            self.quit.pack(side="bottom")

        def say_hi(self):
            print("hi there, everyone!")

    root = tk.Tk()
    app = Application(master=root)
    app.mainloop()



Related links:
* <a href="https://docs.python.org/3/library/tkinter.html">tkinter module</a>
* <a href="https://pythonbasics.org/tkinter/">Tkinter intro</a>
* <a href="https://gumroad.com/l/ErLc">Tkinter course and examples</a>
Show Me Your #coderclaws
Tags: coding, javascript, coderclaws
Published: 2019-07-10 15:14:41

---
title: Show Me Your #coderclaws
published: true
description: When you want to look stylishAF while coding sport some coderclaws.
tags: coding, JavaScript, coderclaws
---

Stylish people, show me your #coderclaws! (Thanks to [Sarah Ownbey Chipps](https://twitter.com/SaraJChipps) for the best hashtag ever)

![](https://thepracticaldev.s3.amazonaws.com/i/lwiamlkalu0lub6sffje.jpg)

**edit

For serious #nailinspo:
- [twitter - from:ohhoe nails](https://twitter.com/search?q=from%3Aohhoe%20nails&src=typd)

- [twitter - from:RebeccaSGold nails](https://twitter.com/search?q=from%3ARebeccaSGold%20nails&src=typd)
The most popular search engines
Tags: google, searchengines, yahoo, bing
Published: 2019-07-10 15:09:47

Many users find Google the most popular search engine. It is true, but it’s also true, that there are other popular engines and they serve lots of search queries per day. They’re available and also useful. Let’s talk about them.   
Google. This is a giant in its niche and its nearest competitor is far from it. Including all the countries Google is the most popular. In other words it is global search engine with its specific algorithm focused on user-friendly factors. All the web-resources should be oriented to site-visitors. Useful, informative and easy in use sites have an advantage, but of course Google algorithm consists of endless list of factors and to be in TOP, webmasters are to do their best. 
So, if you’re interested in <a href="https://spyserp.com/blog/top-10-best-search-engines-list">List of the most popular search engines</a> welcome:
Bing. It has become available since 2009. It is used in more than forty languages. It is developed by Microsoft Corporation. Yahoo search is powered by Bing. 
Yahoo. It was founded in 1994. It searches on the basis of Bing. It also works as email provider and by the way is the best known email provider. It is the third best known search engine globally. 
ASK. It was founded in 1996. Question-Answer format became successful. Its popularity as search engine is high enough. 
Baidu. It was founded in 2000. In China Baidu is the best known search engine. It serves more than one billion search queries per month. But remember, it is Chinese engine. 
DuckDuckGo. It was founded in 2008. The founders refuse to track users and it is a core advantage of it. DuckDuckGo has many other nice features.
Blekko. It is a new engine. It has favorable searching facilities. Webmasters can use its tools for free. This is user friendly system.
Zero tests → App with tests?
Tags: discuss, ruby, rails
Published: 2019-07-10 14:57:53

---
title: Zero tests → App with tests?
published: true
description: 
tags: #discuss #ruby #rails
---

I'm curious which small steps should I do to cover my existing app with tests from zero?

It seems obvious: just start writing tests, but maybe there're some hints? Share your experience, please
Reflection Time! Share how far you have come in the last few years.🚀
Tags: discuss, growthmindset
Published: 2019-07-10 14:27:45

---
title: Reflection Time! Share how far you have come in the last few years.🚀
published: true
description: 
tags: #discuss #growthmindset
---

Here we are busy in achieving our goals, busy in the now with work and life. Let’s take a moment to look back and realize just how far we have come. 

- Any win, small or large counts.
- Any change for the better counts. 
- Any progress towards your goals counts 

Please share how far you have come in the last few years to inspire others. 🙇🏽‍♂️
Alex the CSS Husky
Tags: codepen
Published: 2019-07-10 14:14:06

<p>Based on a playful <a href="https://dribbble.com/shots/2418721-Husky-love">Dribbble shot by Ryan Rumbolt</a> and <a href="https://dribbble.com/kuvaldin">illustration by Alexey Kuvaldin</a>.</p>

<p>Works best in Chrome :)</p>

{% codepen https://codepen.io/anon/pen/dBaWPL %}
Weekly Picks #83 — Development Posts
Tags: webdev, javascript, news, webassembly
Published: 2019-07-10 14:07:30

Welcome everyone to the first DEV-native post of our weekly picks! :tada:
This follows our recent announcement, in case you missed:
{% link https://dev.to/dailynowco/daily-has-gone-open-source-4mhg %}


* [How to create a tracker like the GitHub contribution graph with Node.js and Google Sheets](https://app.dailynow.co/r/5c37c14e0d1ee7d17247e00eb9a284d5)
* [The Best Book to Read as a Developer](https://app.dailynow.co/r/a40fd9096a7a512a7df15bc0fbac1ad6)
* [Eva Colors — AI powered color generator](https://app.dailynow.co/r/0965bd16bbda171a7818aa2fb89a65d1)
* [WebAssembly: The Future of JS and a Multi-Language Web](https://app.dailynow.co/r/b90d5fe0e3c49f1fd454f44d7c3ae360)
* [12 Tips for Improving JavaScript Performance](https://app.dailynow.co/r/50ef66cdb387c7eb46479005d714af04)
* [Storing credentials the right way!](https://app.dailynow.co/r/22533610f435c40de924d9e8d6c5c4a8)
* [Understanding Design Patterns: Facade using Pokemon and Dragonball Examples!](https://app.dailynow.co/r/c97be8098e786683cad27c9709f6cbdd)
* [Parsing Expressions in JavaScript](https://app.dailynow.co/r/0ebdad13f23c08a89b5cbf740fe5d459)
* [Beware! Angular can steal your time.](https://app.dailynow.co/r/63fd80000ae71e460233ecacfdc1abdc)
* [Why I'm so jazzed about the Optional Chaining proposal in JavaScript ?](https://app.dailynow.co/r/22b2a4bdfde5f5eb166c62571e070c05)

* * *

[_Thanks to Daily_](https://www.dailynow.co/) _developers can focus on code instead of searching for news. Get immediate access to all these posts and much more just by opening a new tab._

[![Daily promotion cover](https://cdn-images-1.medium.com/max/1024/1*7bwIhcH467BKX5Ni8XWpQg.jpeg)](https://www.dailynow.co/)
Next.js 9.0 + TypeScript + redux-observable を試してstarterとして公開した
Tags: react, nextjs, reduxobservable, typescript
Published: 2019-07-10 14:02:02

---
title: Next.js 9.0 + TypeScript + redux-observable を試してstarterとして公開した
published: true
description: Next.js 9.0が出たので触ったら色々ハマった話
tags: react, next.js, redux-observable, typescript
---

Next.js 9.0が出たので試してみたところ、色んなところでハマったのでメモとして残す。
## redux-observableを導入する段階でハマる
Next.jsでreduxやredux-observableなどを使う時は `pages/_app.ts`に処理を書くらしく、いつもと勝手が違ってハマった。
[next-redux-wrapper](https://github.com/kirill-konshin/next-redux-wrapper)とかあるみたいだけど最終的には使わずに[こんな感じ](https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter/blob/master/pages/_app.tsx)で書いた。
## CSSのimportでハマる
[Semantic UI React](https://react.semantic-ui.com/)を導入する際に
```typescript
import 'semantic-ui-css/semantic.min.css'
```
という感じでCSSをimportしようとするとエラーが出てハマった。
Next.jsではwebpack.config.jsで書いているような設定をnext.config.jsに書くらしかったので書いてみたもののサクッと動かなかった。
そして`@zeit/next-css`というのを使えば動くという情報を見つけたので試してみたらInvalid Optionなどと言われて動かずさらに検索すると[関係ありそうなissue](https://github.com/zeit/next-plugins/issues/392)を発見。
ただのworkaroundだけどとりあえず動くようにはなった。
next.config.jsは[こんな感じ](https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter/blob/master/next.config.js)になっている。
## Styled Componentsでハマる
ブラウザで画面を開くとconsoleにエラー出ていたので調べたら.babelrcに
```json
{
"presets": ["next/babel"],
"plugins": ["styled-components"]
}
```
このあたりを追記したら良いとの情報を得て追記したら解決した。
## 開発開始できそうな感じになったので公開した
これでとりあえずエラーも消えて動くようになり開発を始めれそうな状態にはなった。
Next.jsを使わなければ特に気にもならないようなことでハマって結構めんどくさかった。
今後の自分のためと、同じようにNext.js触ろうとしたけど普段通りにいかず面倒くさくて投げた人のために`yarn dev`ですぐ開発を始めれるものを残しておいた。
[https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter](https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter)
Aliasの設定はまだ上手くいっていないし、認証周りもちゃんとできてないのでもうちょっと色々調べる必要がありそう。
Next.js 9は結構いい感じっぽいのでNuxt.js人気に早く追いついて欲しいなー
Tried & published Next.js 9.0 + TypeScript + redux-observable starter
Tags: react, nextjs, reduxobservable, typescript
Published: 2019-07-10 14:00:11

---
title: Tried & published Next.js 9.0 + TypeScript + redux-observable starter
published: true
description: This article is a note of my trial and error.
tags: react, next.js, redux-observable, typescript
---

Next.js 9.0 has been released.
I tried it with my usual development libs (redux-observable, styled components, etc...), and I found some gotchas, so I'm writing down this.
## redux-observable
Using redux-observable with Next.js, we have to put some code to `/pages/_app.ts`, and the style is little bit different comparing to pure react development.
There are some libraries that helps it
- [next-redux-wrapper](https://github.com/kirill-konshin/next-redux-wrapper)
- [next-redux-saga](https://github.com/bmealhouse/next-redux-saga)
But there are no next-redux-observable or something.
So, eventually I wrote following code.
[https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter/blob/master/pages/_app.tsx](https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter/blob/master/pages/_app.tsx)
## CSS import
I've tried to use [Semantic UI React](https://react.semantic-ui.com/).
But when I write following line, I've got an error.
```typescript
import 'semantic-ui-css/semantic.min.css'
```
In the Next.js world, we have to create next.config.js instead of webpack.config.js .
So I wrote css-loader settings on it. But it didn't work well.
I googled & found the information about `@zeit/next-css`.
But next-css was displaying error like `Invalid Option`, so I googled more, and I found [the issue](https://github.com/zeit/next-plugins/issues/392) of it.
It's just workaround, but worked well.
My next.config.js is following.
[https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter/blob/master/next.config.js](https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter/blob/master/next.config.js)
## Styled Components
There are some errors on the browser console.
I've googled again and some articles saying use `.babelrc`.
So I've added `.babelrc` and it solved the issue.
```
{
"presets": ["next/babel"],
"plugins": ["styled-components"]
}
```
## Published starter
There are no errors for now.
I felt that using Next.js is little bit different from pure react development, and it made me confusing.
So I published this article & [Next.js 9.0 + TypeScript + redux-observable starter](https://github.com/kunihiko-t/nextjs9-ts-redux-observable-starter) for me, and the person who is trying Next.js but struggling with errors.
But this repository is still WIP.
- [ ] Use middleware or something for Authentication
- [ ] Set alias for `import { foo } from '~/foo'`
- [ ] Remove 'any' type from epic
component #1 - Carousel
Tags: react
Published: 2019-07-10 13:52:50

---
title: component #1 - Carousel
published: true
description: This is a part of *30 components / month* challenge.
tags: #react
---
{% codesandbox fwq72 %}

## What I have learned?

- How to _useState_.
  Coding with react for several months and dealing with classes I now find that using state inside a function is just amazing. 😌

- How to _useEffect_.
  Handling side effects inside the useEffect and clean up when necessary.
  And telling to that effect when and when not to run to optimize the performance. This is made possible by passing the second argument for useEffect.

- Using keys to have a unique element or component.
  Before I thought that keys are only meant for making a unique item when mapping a list to remove the intimidating warning message from console.

## What are the main challenges?

  As I develop this component I'm kinda doubtful for each solution that I'm going to try, knowing that it has the chance to solve the problem. I still get very uncomfortable doing it.

## Why am I doing this anyway?

- To learn.
- To have fun.
- To future Joimee (for reference).

Resources:
[React Today and Tomorrow and 90% Cleaner React With Hooks](https://www.youtube.com/watch?v=dpw9EHDh2bM&t=4520s)
[Hooks Reference](https://reactjs.org/docs/hooks-reference.html)



Salamat.
Javascript File Concatenation 
Tags: help
Published: 2019-07-10 13:32:05

Hey guys,

I'm wanting to use [SweetAlert2](https://github.com/sweetalert2/sweetalert2) in one of my applications but I'm having a problem with the JS files. The developers for SweetAlert2 have several JS files that seem to group relevant JS together. But I'm using Oracle APEX, and it doesn't quite allow the JS files to reference each other as they do (because they assume they're in the same directory).

Can anyone give me pointers on how to concatenate these files or if there's an easier way to do it? It'll have to be one file at the end.
Name, Please?
Tags: ruby, documentation, markdown, github
Published: 2019-07-10 13:22:55

---
title: Name, Please?
published: true
description: 
tags: ruby, documentation, markdown, github
---
Recently I posted an article whose examples are done with the Ruby Interactive Shell, <code>irb</code>.

It was annoyingly tedious to copy and paste snippets from the <code>irb</code> window into the post editor.

So I decided to automate. (Shocker!).

I'm building a program that will:

- Read markdown that contains snippets intended for <code>irb</code>.
- Run each such snippet through <code>irb</code>, capturing the session.
- Replace the original snippet with that output.
- Mark the changed passage as a Ruby code block.

Question is, what to call it?

- Started out thinking <code>irb2md</code>, but though the output is markdown, the input is not just simple <code>irb</code>.
- Now it's <code>irb_filter</code>, but that doesn't tell an accurate story either.
- Leaning toward <code>irb_in_md</code>, but not happy about it.

Suggestions?