My Hive Posts

    Written by Coding Defined who lives and works in India building useful things. You should follow him on Twitter

    B&W Photo Contest #1 - Reflections - People's Reflection

    January 30, 2018
    b-and-w-photo-contest-1-reflections-people-s-reflection

    This is my 1st entry for the B&W Photo Contest, ran by @daveks and judged by @otage. ![IMG_20180108_172034_2.jpg](https://steemitimages.com/DQmT2ZdhrWGZFDYHx82bQHuGpXLm9XkUHPnrRAVeWehqL7w/IMG_20180108_172034_2.jpg) Camera : Nokia 6, Edited to B&W

    [AnimalPhotography] A Camel

    January 29, 2018
    animalphotography-a-camel

    In Puri Beach you will see people are attracted to Camel Ride because they are decorated with vibrant color. ![IMG_20180108_164716.jpg](https://steemitimages.com/DQmdRFR2fVs4Z9xiLSVzaie3VUBREmZLXgHG9iU9Cqhxapt/IMG_20180108_164716.jpg)


    ![IMG_20180108_164712.jpg](https://steemitimages.com/DQmU252qHYS9Fn8SevLBfWTEuPtyPBSHWY9M4yAC4QSBNtK/IMG_20180108_164712.jpg)

    Utopian Github Account to Post Issues

    January 28, 2018
    utopian-github-account-to-post-issues

    #### Components Utopian.io posts issues on the user's behalf to the Github using the authentication token. There are lot of users who have found a bug and post that in the Utopian without knowing how the issues are created in the Github, they also does not have account on the Github. Also the Github can revoke your token if it is copied anywhere on the internet. Once the token is revoked you need to sync again with the Github. #### Proposal My proposal is to have a Utopian Github Acoount which does the posting on the User's behalf if the users did not syncd their Utopian account with the Github Account. In that way all the issues will be copied to the github and not only in the Utopian Bug-Hunting Category. Also along with the Issue it can write that Utopian.github created the issue on behalf of @codingdefined. #### Mockups / Examples ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1517127043/o6tqmrtfasipue0ixrns.png) #### Benefits As I am a bug moderator I need to check the issue posted before on Utopian as well as on the Github, why because as of now if your Github account is not synced with the Utopian the issue will not be posted on the Github. So the benefit of using it is that it will always post the issue on Github whether you have an account on github or not.


    Posted on Utopian.io - Rewarding Open Source Contributors

    Getting Started With Gatsby.js - Part 2

    January 27, 2018
    getting-started-with-gatsby-js-part-2

    In this tutorial you will be Learning - Styling Gatsby Website - CSS in Gatsby - Gatsby Plugins #### Difficulty - Basic #### Tutorial Contents Before Starting the tutorial we will go through the Part 1 again as a part of Recap, so in Part 1 we have learnt about the directory structure of the Gatsby Directory, Helmet Component which attached all the header meta information like description, keywords to your generated HTML file. A lot of Components like TemplateWrapper, Link, IndexPage etc. You might be thinking that what is the use of Components and why its necessary. The answer of this question is the code architecture is simplified for building large websites because then you get some part of the code which can be reused as well as keeping it as simple as possible. So a simple example for a Component would be a LinkButton. For creating a link button we would have been using `a` tag and add a href, with some text inside it. Since we are talking about components the best is to create a LinkButton component and whenever we will be using it use it like This is a LinkButton Component. Thus your website will be made of components and it is a building block of your Website. ##### Styling Gatsby Website & CSS in Gatsby Since most of us are familiar with CSS, we will be looking at one of the library which Gatsby Provides and that will help us to do styling in Gatsby. We will be using [Glamor](https://github.com/threepointone/glamor) which helps you to write CSS diretly in your components. The advantage of using it is that it helps in resolving th name conflict which we often encounter in normal CSS thus no need to write !important to fix any issue. Since all the CSS elements are tightly coupled with their components it makes it easier to edit those rather than thinking where all the components are being used. At first we will install the plugin as `npm install --save gatsby-plugin-glamor` and then add it to the gatsby-config.js as shown below : ``` module.exports = { siteMetadata: { title: 'Gatsby Default Starter', }, plugins: ['gatsby-plugin-react-helmet', 'gatsby-transformer-json', 'gatsby-plugin-glamor'], }; ``` In the below code we are using the Glamor where we are writing the inline CSS inside the div element ``` import React from "react" const UtopianMod = p =>

    {p.modname} : {p.modcategory}
    export default () =>

    Utopian Moderator

    ``` When you run it, it will be shown as where you can see all the css has different tag attached to it, thus making it really easy to update it. ![gatsby3.PNG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1517050899/xatrpsg31wytne6viabu.png) Now there is one more option for you if you do not like to use Glamor and that is Styled Components. In styled Components you can write actual CSS element inside your Components and not like Glamor where you will write CSS in the property. It also has the same advantage as Glamor where it helps in resolving the name conflict which we often encounter in normal CSS thus no need to write !important to fix any issue. Since all the CSS elements are tightly coupled with their components it makes it easier to edit those rather than thinking where all the components are being used. For working on it you need to install two plugins gatsby-plugin-styled-components and styled-components as shown below `npm install --save gatsby-plugin-styled-components styled-components` Similarly you need to add it in gatsby-config.js and also styled-components is to be imported in your file. Now lets say we want our modname and modcategory should be different, so we will write ModWrapper, Modname and ModCategory component and just change the normal CSS with the component. ``` const ModWrapper = styled.div` display: `flex`, alignItems: `center` `; const Modname = styled.h2` margin: 0 0 15px 0; padding: 0; `; const Modcategory = styled.div` flex: 1; margin-left: 20px; padding: 15px; `; const User = p => ( {p.modname}: {p.modcategory} ); ``` ##### Gatsby Plugins Gatsby Plugins are small amounts of JavaScript code which is created by the community members which can be used when you are building Gatsby Sites. There are a lot of plugins available, even though if you like your own plugin you can create that just by writing your own Javascript code. The plugins are easy to install and use thus you do not have to reinvent the wheel of writing everything of your own. To install any plugins at first you need to have a npm installed, then you can install it using the command `npm install --save gatsby-transformer-json` where gatsby-transformer-json is a plugin for parsing raw JSON strings into JavaScript objects from JSON files. Next you need to add it to the gatsby-config.js file as shown below ``` module.exports = { siteMetadata: { title: 'Gatsby Default Starter', }, plugins: ['gatsby-plugin-react-helmet', 'gatsby-transformer-json'], }; ``` #### Curriculum - [Getting Started With Gatsby.js - Part 1](https://utopian.io/utopian-io/@codingdefined/getting-started-with-gatsby-js-part-1)

    Posted on Utopian.io - Rewarding Open Source Contributors

    B&W Photo Contest - Nature Abstracts - Multiple Entries

    January 26, 2018
    b-and-w-photo-contest-nature-abstracts-multiple-entries

    My entries for @davek's B&W photo contest themed "Nature Abstracts" with guest judge for this week @dmcamera. ### Entry 1 - From a Train, somewhere near Andhra Pradesh, India ![IMG_20180110_145521_2.jpg](https://steemitimages.com/DQmeCy9uPxacDybko9PzCXBAodFJbAK4ib2C3aR7Fv46iR6/IMG_20180110_145521_2.jpg) ### Entry 2 - Nandi Hills, Bangalore, India ![IMG_20171126_075502_2.jpg](https://steemitimages.com/DQmZ6aNj12iTbtmmMHHtmRha6Egf836BdgW9NkTXXhAKeXA/IMG_20171126_075502_2.jpg) ### Entry 3 - Udaipur, India ![IMG_20170303_161735554.jpg](https://steemitimages.com/DQmPLnno3cxsEQcMVA7RDv6oCcd8cVXvUCcxWEkaMCeZZjU/IMG_20170303_161735554.jpg) ### Camera : Nokia 6

    Happy Republic Day to All Indians

    January 26, 2018
    happy-republic-day-to-all-indians

    ### Happy Republic Day Indians ![](https://upload.wikimedia.org/wikipedia/commons/4/41/Chhatrapati_Shivaji_Terminus_%28formerly_Victoria_Terminus%29_-_Lit_up_on_Republic_Day_2015_-_Panorama.png) Source : wikimedia.org My Country India is great like any other country in the world. The air here is of freedom and the sacrifices made by the heroes i.e. real heroes who protected this country. To name few there are Subhas Chandra, Bhagat Singh and Sukhdev. Still the country is developing but I am happy that we are on a right path with a wave of development which will make every city and every village to be happy. Dreams will come true like the dream of freedom came true on 1947. Let's make this world better by making yourself better and educating people around you. Jai Hind !!!

    1000 Followers Milestone

    January 25, 2018
    1000-followers-milestone

    In my [last Milestone Post](https://steemit.com/steemit/@codingdefined/a-dual-milestone-achieved-in-steemit) which was 3 months before I have shared that I have reached Reputation 55 and 600 followers. Its been 3 months after that post and I reached 1000 followers milestone. ![](https://steemitimages.com/DQmREcczJ4Ab5st6UHTcZo13YgUHRPn2CpVBfGYY1ESxqMm/image.png) It always good to record your milestone because it will give you the sense of work you are doing in the awesome platform also it will help you to achieve more i.e. you can target your own milestone. When I have posted about the last milestone my next milestone was 60 Reputation and 1000 followers and I got the reputation but not the followers so I waited for this to complete before posting. It changed a lot in these 3 months here in Steemit personally. I became Utopian.io Moderator and also working on some of the cool apps to help the big community in every small possible way I can.

    Camel Ride on the Beach

    January 24, 2018
    camel-ride-on-the-beach

    In Puri you will see a lot of Camels in and around the beach because people love to take a ride. I too have taken the ride and you will love it to the core. ![IMG_20180108_110609.jpg](https://steemitimages.com/DQmRNqLJ7ENtFY4EjonVS98qMfyv1pbHMS4Rdybso5LMYPJ/IMG_20180108_110609.jpg) ![IMG_20180108_110631.jpg](https://steemitimages.com/DQmVTUsxxXj9zr3DRj2hQyM7Gq2HcjBdKd5wHsBYpkrL7dn/IMG_20180108_110631.jpg) Camera : Nokia 6, No Editing

    Removing Duplicate and Too Frequent Steemit and Busy link from Discord

    January 23, 2018
    removing-duplicate-and-too-frequent-steemit-and-busy-link-from-discord

    We often see in the Post Promotion channel of the Discord that people posts his or her same post more than once or more than one in 24 hours. So we need a script which will intelligent enough to delete those posts if its finds duplicate or more than one posts by a user in 24 hours. This will keep the post promotion clean and everyone will get the equal opportunity to promote their posts. ###### Technology Stack The application is written in Node.js and we save the data in Sqlite database. Along with that we will use Discordie npm package to talk to Discord API. Along with this we also use Cluster Npm Package to make the BOT running 24 hours even if it crashes anytime. ###### Code We are using Sqlite Database using the NPM package `sqlite3`. So before starting we need to create the table, whenever you run the script it will see if the `posts.db` has been created or not, if not it will create one for you with the Columns required in the script as shown below : ``` let db = new sqlite3.Database('posts.db'); db.serialize(function() { db.run("CREATE TABLE if not exists posts_info (discordName TEXT, post TEXT, time TEXT, channel_id TEXT)"); }); ``` Next we Connect to the Discord using Discordie and whenever we see any incoming messages we will send the event to the Check Posts Function. ``` client.connect({ token: 'Bot Token' }); client.Dispatcher.on(Events.GATEWAY_READY, e => { console.log('Connected as: ' + client.User.username); }); client.Dispatcher.on(Events.MESSAGE_CREATE, e => { if (e.message.author.bot) { return; } checkPosts(e); }); ``` In the Check Posts function we check if the link is valid i.e. if its from Steemit or Busy, if it is valid we check in the database if the user has added the Posts before by checking the discordName and channel_id. Once we get the posts we check the posts URL and the Time Difference between the earlier post and current post. If everything is correct you can post otherwise the bot will delete the post with a warning. ##### Commits https://github.com/codingdefined/DiscordSpamRemoval/commit/da4821165749b309b65e8c9b70df1fce146ad331 https://github.com/codingdefined/DiscordSpamRemoval/commit/6b124748fcf6ff7cb4c5ebc9781349b58de5db57 https://github.com/codingdefined/DiscordSpamRemoval/commit/c36b504c6280d9ac7220b8f5b367cc2dd3fc7968 ###### Bot in Action ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516698538/i6ba9rwblfjnix41vjtp.png) ###### Roadmap As of now the Bot will save the Channel ID where the posts have been written along with Discord Name, now if you use more than one discord account you can still spam using the different account. We need to store the Steemit Username, Discord Name, Channel Id, Guild Id and Posts URL to reduce the spamming as much as possible. Create Test Cases and error handling. ###### How to contribute? The code is freely available in [Github](https://github.com/codingdefined/DiscordSpamRemoval) which you can fork and create a pull request. If you need any feature to be added, you can also talk to me on the Discord (Id - codingdefined).


    Posted on Utopian.io - Rewarding Open Source Contributors

    [GoldenHourPhotography] Source of Light

    January 22, 2018
    goldenhourphotography-source-of-light

    This Image was taken in Puri Beach in the morning, when Sun was rising and it making everyone happy with its warm rays. This was a winter morning but a lot of people were still there in the beach to just get a glance of first ray of the Sun. ![IMG_20180108_071933.jpg](https://steemitimages.com/DQmZtTdcSpUF6douyqz4CiwRXrrThjUC1rJUk66TheEiptb/IMG_20180108_071933.jpg) Camera : Nokia 6