Code Monkey home page Code Monkey logo

chainlinkhack's Introduction

https://cll-devrel.gitbook.io/javascript-for-blockchain-master-class/decentralized-news-service-contract

If this looks too tricky for you, check out: https://docs.chain.link/quickstarts/deploy-your-first-contract

Day 1: Build a simple decentralized news aggregator service

Following Richard's tutorial, the following was created:

Todo

  • Create a contract that uses Chainlink functions to get the latest news from hackernews api
  • Store the story on the blockchain
  • Display the stories on a webpage

Steps to run the project:

The contract is good to go and hooked up to Chainlink Functions Subscriber. To deploy and set up your Functions, you need to:

  • Compile and deploy the contract on a testnet (this is on Sepolia)

  • Create and fund a Chainlink Functions Subscription

  • Add your deployed contract address to your subscription as a "Consumer"

  • Add your subscription ID to the contract

  • Run the sendRequest function on the contract to get the latest news from Hackernews and save it to the blockchain

  • Call the getAllArticles function to get the latest news from the blockchain

    function getAllArticles() public view returns (string[] memory) {
            string[] memory allArticles = new string[](articles.length);
            for (uint i = 0; i < articles.length; i++) {
                allArticles[i] = string(articles[i].url);
            }
            return allArticles;
        }
  • in /src/pages/index.astro you can display the stories on a webpage

    async function fetchOGData(url) {
    try {
      const response = await fetch(url);
      const html = await response.text();
      const dom = new JSDOM(html);
      const doc = dom.window.document;
      let ogTitle =
        doc.querySelector('meta[property="og:title"]')?.content || url;
      const ogImage = doc.querySelector('meta[property="og:image"]')?.content;
      return { ogTitle, ogImage, url };
    } catch (error) {
      console.error("Error fetching OG data:", error);
      return { ogTitle: "No title", ogImage: "No image", url };
    }

}



To get started quickly with this code, clone the repo, run `npm install` and `npm run dev`

nothing might show on the screen, why?

You need to create a `.env` file and have the following:

```bash
#### RPC for sepolia
PROVIDER_URL="https://rpc.sepolia.org"
CONTRACT_ADDRESS="your-contract-address"

Follow this article to get your contract ready and deployed.

This repo is just the frontend Dapp that interact with the smart contract using ether-js.

chainlinkhack's People

Contributors

codeleom avatar

Watchers

 avatar

Forkers

tippi-fifestarr

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.