GithubHelp home page GithubHelp logo

pablofelipe01 / guest-book Goto Github PK

View Code? Open in Web Editor NEW

This project forked from olonho/guest-book

0.0 0.0 0.0 15.54 MB

Sign in with NEAR and add a message to the guest book!

Home Page: https://near-examples.github.io/guest-book/

License: MIT License

JavaScript 61.58% TypeScript 22.21% HTML 6.36% SCSS 9.85%

guest-book's Introduction

Guest Book

Build Status

Open in Gitpod

Sign in with NEAR and add a message to the guest book! A starter app built with an AssemblyScript backend and a React frontend.

Quick Start

To run this project locally:

  1. Prerequisites: Make sure you have Node.js โ‰ฅ 12 installed (https://nodejs.org), then use it to install yarn: npm install --global yarn (or just npm i -g yarn)
  2. Run the local development server: yarn && yarn dev (see package.json for a full list of scripts you can run with yarn)

Now you'll have a local development environment backed by the NEAR TestNet! Running yarn dev will tell you the URL you can visit in your browser to see the app.

Exploring The Code

  1. The backend code lives in the /assembly folder. This code gets deployed to the NEAR blockchain when you run yarn deploy:contract. This sort of code-that-runs-on-a-blockchain is called a "smart contract" โ€“ learn more about NEAR smart contracts.
  2. The frontend code lives in the /src folder. /src/index.html is a great place to start exploring. Note that it loads in /src/index.js, where you can learn how the frontend connects to the NEAR blockchain.
  3. Tests: there are different kinds of tests for the frontend and backend. The backend code gets tested with the asp command for running the backend AssemblyScript tests, and jest for running frontend tests. You can run both of these at once with yarn test.

Both contract and client-side code will auto-reload as you change source files.

Deploy

Every smart contract in NEAR has its own associated account. When you run yarn dev, your smart contracts get deployed to the live NEAR TestNet with a throwaway account. When you're ready to make it permanent, here's how.

Step 0: Install near-cli

You need near-cli installed globally. Here's how:

npm install --global near-cli

This will give you the near CLI tool. Ensure that it's installed with:

near --version

Step 1: Create an account for the contract

Visit NEAR Wallet and make a new account. You'll be deploying these smart contracts to this new account.

Now authorize NEAR CLI for this new account, and follow the instructions it gives you:

near login

Step 2: set contract name in code

Modify the line in src/config.js that sets the account name of the contract. Set it to the account id you used above.

const CONTRACT_NAME = process.env.CONTRACT_NAME || 'your-account-here!'

Step 3: change remote URL if you cloned this repo

Unless you forked this repository you will need to change the remote URL to a repo that you have commit access to. This will allow auto deployment to GitHub Pages from the command line.

  1. go to GitHub and create a new repository for this project

  2. open your terminal and in the root of this project enter the following:

    $ git remote set-url origin https://github.com/YOUR_USERNAME/YOUR_REPOSITORY.git

Step 4: deploy!

One command:

yarn deploy

As you can see in package.json, this does two things:

  1. builds & deploys smart contracts to NEAR TestNet
  2. builds & deploys frontend code to GitHub using gh-pages. This will only work if the project already has a repository set up on GitHub. Feel free to modify the deploy script in package.json to deploy elsewhere.

guest-book's People

Contributors

dependabot-preview[bot] avatar chadoh avatar thisisjoshford avatar mikedotexe avatar janedegtiareva avatar dependabot[bot] avatar vgrichina avatar buckram123 avatar bucanero avatar benkurrek avatar idea404 avatar frankonly avatar harshak777 avatar mehtaphysical avatar tarasenkofirelabs avatar adsick avatar

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.