Giter Club home page Giter Club logo

homepage's Introduction

Nova Homepage

This project was generated with Angular CLI version 12.1.2.

Development server

Run ng serve for a dev server. Navigate to link shown. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

homepage's People

Contributors

morningstar2898 avatar jb4earth avatar zion16 avatar

Stargazers

 avatar

Watchers

Naomi Schettini avatar  avatar

homepage's Issues

testing vs deployment

we would like to do a good amount of testing before we release -- that means using the vercel deployment for testing

temporarily pause the Mainnet check and error that forces users back to the home page if they are not on Mainnet

pull the on/off toggle up to a .env file

Staking

use ether.js to

  1. approveAll on staking contract (allow staking and unstaking)
  2. stake selected via staking contract

claim

call claim on smart contract

should be a button in the $NOVA estimate claim component such that the button only shows as active when there is $NOVA available to claim (otherwise gray and inactive)

homepage update

link to blog at top of homepage

<iframe src="https://thesupernova.substack.com/embed" width="480" height="320" style="border:1px solid #EEE; background:white;" frameborder="0" scrolling="no"></iframe>

UX/UI Overhaul

use the figma file and best practice to update all styles.

Try to make the css make some sense while in progress.

team comes in scrambled

need to sort the team import! sometimes it shows right other times descriptions, names and faces are mixed up

new login flow issue

disconnect wallet in metamask,
refresh page
log back in with metamask (havoc ensues)

fix to act more reasonably

claim button not active

clicking the claim button does not result in claiming available $Nova

please also make the refresh button match existing styling while you're working on this.

Education Page

Main sections:

  1. Header (Welcome to Nova)
  2. Socials (Substack and Twitter widgets)
  3. Choose Your Subject (Ethereum, NFTs, DAOs, DeFi, Wallets, Ecosystem, Terms, Guides)
    -- on subject choice, subsection infromation appears -- info for each section follows and should be pressented as Question Answer where Questions allways show with either a p[lus or minus next to them. When the plus is clicked the Answer is shown, when the minus is clicked the answer unhides: Each subject should be shown with an icon and full text name.

info for subsection:

ETHEREUM ESSENTIALS
• What is Ethereum? Ethereum is an online public ledger. Using the new technology of the blockchain, Ethereum allows users to create smart contracts allowing for decentralised applications (Dapps) to be created. Ethereum improves on the restrictive code of Bitcoin which grants developers much more freedom in creating new applications and protocols.

• Why is it important? Decentralization is important. So too is being in charge of your finances. The peer-to-peer finance system of the blockchain is one of the significant milestones in mankind. It allows a person to be in charge of their own finance on the chain. Ethereum allows the introduction of Dapps which are improvements to every application within web2 (such as facebook and Instagram) where those applications are owned by big corporations no one single entity will own Ethereum. That combined with the open-source nature means no one is trying to steal your data.

• What are Smart Contracts? The simple way to understand smart contracts is they are code that acts as binding contract that is embedded into the application. Smart contracts are used within Dapps for purchasing agreements without the need for a third party.

• What are Decentralized Apps (Dapps)? Applications that are decentralized and created for the blockchain. Dapps are created as open-source applications where the code can be found and improved on by anyone in the world. 

• What is Ether. Ether is the native token of Ethereum. When you buy Ethereum on an exchange you will receive its native token of Ether.

• What are Gas Fees? Gas fees are payments made by users to compensate for the computing energy required to process and validate transactions on the Ethereum blockchain. "Gas limit" refers to the maximum amount of gas (or energy) that you're willing to spend on a particular transaction.

• What is Layer-1? A layer-1 (L1) network is the name ofr the base blockchain. Ethereum (ETH) and Bitcoin (BTC) are layer-1 protocols. They are both considered the main networks in their respective ecosystem.

• What is Layer 2? A layer-2 (L2) network is a term to provide Ethereum scaling solutions. A layer 2 is a separate blockchain that extends Ethereum while keeping the security guarantees. For more information on Ethereum layer-1 and Layer-2 please visit the Ethereum foundation webpage https://ethereum.org/en/layer-2/

• What is the Ethereum merge? The merge represents the joining of the Ethereum Mainnet (what we use at present) with its proof-of-stake Beacon Chain. This changes the consensus of Proof-of-work to a Proof-of-Stake model that scales, is more secure and provides far greater sustainability. For more information on the Ethereum merge please visit the Ethereum Foundation webpage https://ethereum.org/en/upgrades/merge/

NON-FUNGIBLE TOKENS (NFTS)
• What is a Non-Fungible Token (NFT)? A NFT is the authenticity ownership of a digital product. The blockchain allows users to own a digital asset that is searchable by a public ledger. This means if someone owns a NFT you can look up on the internet who owns it.

• Why is digital ownership important? The introduction of the Blockchain has allowed digital products to be owned as NFTs on-chain. Never before has it been possible to own a digital asset as a store of value or financial return on profit. As NFTs technology matures there will be endless use cases besides artwork in the form of ticketing, vouchers, medical data and more.

• What are digital NFT collectables? Just like physical collectables, NFTs can also be a way for consumers to purchase digital, intangible products such as artwork and media on the blockchain. Some examples include generative art of Crypto Punks and the Bored Ape Yacht Club (BAYC). The Ethereum Name Service (ENS) and Media such as Books, music and films that have are enclosed within the NFT.

• What makes NFTs valuable? NFTs provide digital scarcity on the blockchain that is secure. NFTs cannot be copied on chain, ownership is tied to the existing account and can be looked up like a public ledger at any time.

• Who buys NFTs? In time NFT adoption will lead to the technology being used in ticketing, vouchers, gaming, films, music and books. At present, Crypto native customers with a love of the blockchain are experimenting, creating some great projects (and some out right scams). Its the wild wild west or digital gold rush.

• What are the Statistics on NFTs? NFT sales in 2021 skyrocketed to XXX with it being projected to hit XXX in 2022. Opensea the largest marketplace for digital assets is a billion-dollar company.

• Why are NFTs being labelled as Ponzi schemes? The sad reality of the Crypto space and due to its volatile nature of quick gains means many attempts to scam new entrants into the marketplace. It’s unfortunate as while some NFT use Ponzinomics its not a definition of all projects within the space. 

• What is exit liquidity? When a project is hyped, new entrants buy into the token or NFT. The founders then use the sustainable hype to sell their assets thus exiting their liquidity on new customers.

• What is Minting? Minting is the process of being the first person to purchase an NFT from a smart contract listed on the Blockchain. Hence a person has been the first to “Mint” an NFT.
  
• Where are the NFT marketplaces? The most common NFT marketplace is Opensea . Opensea has a great easy to use interface and also provides custom made smart contracts for artists. Other Market places include SuperRare, Rarable, LooksRare, Gem and Immutable X.

Opensea- https://opensea.io/
SuperRare- https://superrare.com/
LooksRare- https://looksrare.org/
Gem (NFT agrigator)- https://www.gem.xyz/
Immutable X- https://www.immutable.com/

• What are secondary sales? After a NFT has been minted out, as in a collection has been exhausted. The only way consumers can purchase the NFT is on secondary marketplaces. The current most commondly used marketplace is Opensea.

• Can I make an NFT? There are two ways to make a NFT. The first is by smart contract deployment on a website. This generally requires a website creation and a smart contract to be created for the project. Nova can provide newcomers with developers by emailing/contact via XXX.

The second way to create a NFT is to go through the custom contract on NFT marketplaces. Opensea has an easy to follow guide, process for creating new artworks as NFTs.
Decentralized Autonomous Organisations (DAO)
• What are DAOs? A decentralised Autonomous organisation (DAO) is an organisation where the rules are encoded as a computer program that is controlled by organisation members which are not centralized by governess. This means there is no top-down hierarchy, no CEO to make decisions. A core team exists to guide the project but the governess is made by holders who have voting rights on the treasury.

• What makes DAOs unique? A DAO is unique as it is not controlled by a centralized hierarchy system. DAOs are entirely decentralized from modern companies and instead the power is in the holders who have governing rights over the funds of the organisation, on the decision making decisions and proposals put forward are entirely made by holders of the DAO.

• How can DAOs operate? DAOs are new ecosystems that are rapidly evolving entities. DAOs put forward proposals that are generally made by a core team. Members of the DAO then vote on these proposals which can range from where to place digital assets, to buy new assets for the treasury or where to put funds, allocate and invest in. 

• How can I create a DAO? A DAO can be created with four easy steps
  1. Own an Ethereum Name service (ENS) domain

  2. Create a DAO on Aragon https://aragon.org/aragon-client

  3. Configure settings, vote duration and percentage support for DAO launch

  4. Create social media for the virtual community with Discord (and Twitter)

    • What are the benefits of DAOs? DAOs provide a number of benefits in the form of decentralized governance, membership, share-based membership and reputation-based memberships. For more information on DAOs please visit the Ethereum foundation website on DAOs. https://ethereum.org/en/dao/
    Decentralized Finance (DeFi)
    • What is Defi? Decentralized finance (DeFi) is an emerging financial technology based on secure distributed ledgers similar to those used by cryptocurrencies. The system removes the control banks and institutions have on money, financial products, and financial services.

    • How can DeFi assist me? It eliminates the fees that banks and other financial companies charge for using their services. You hold your money in a secure digital wallet instead of keeping it in a bank. Anyone with an internet connection can use it without needing approval. You can transfer funds in seconds and minutes
    • What are some Defi protocols I can look into?

    • Other sources. The Ethereum foundation has a great insight into Defi with DAPPS and documents on understanding decentralised finance -https://ethereum.org/en/developers/docs/dapps/
    DIGITAL WALLETS
    • What is a digital wallet? A digital wallet is an application that is made possible by the Blockchain and one that keeps a user’s funds (tokens and NFT assets) in an encrypted wallet (such as coin spot or metamask) wallet.

    • Coinspot Wallet: A coin spot wallet can easily be made via their website. Coinspot is the most easy-to-access digital wallet that is centralized.

    • Metamask Wallet: Metamask is the Ethereum native wallet that is decentralized. Please refer to the guide on how to set up a metamask wallet. This is also known as a hot wallet that is always connected to the internet and cryptocurrency network.

    • Hardware Wallet (Ledger Nano X): The hardware wallet is linked to a USB Dongle as further security as funds are placed on the USB device. This is also known as a cold wallet as its not connected to the internet.

    • Seed Phase: The seed phase is a 16 word security code that enables users to encrypt their funds without another person having access to it. If a person loses their 16 word security code then there is no way to access the funds.

ECOSYSTEM TERMS
• Airdrops: An airdrop is a claimable token or NFT that is awarded to existing holders that sign the TX. The holder pays nothing for the airdrop and it will appear in the chosen digital wallet.

• Github: A provider of Internet hosting for software development and version control using Git. An open source website with information as a database. Each project can upload its GitHub URL for code which can be used by anyone all over the world. Acting as a hub for developers to seek grants, create new products and meet new associates. 

• Web2: The internet as we know it. Controlled by a centralised company such as Facebook, Instagram and Youtube. There is no ownership of digital assets within web2

• Web3: The new internet. Decentralised and open source allows for anyone to build a new application. Digital ownership is enabled by the Blockchain.

GUIDES
• How to set up a coinspot account
https://www.youtube.com/watch?v=QNu4U2GQZLc&ab_channel=CryptoCoaching
• How to set up a Metamask account
https://www.youtube.com/watch?v=Af_lQ1zUnoM&ab_channel=MoneyZG
• How to set up a Ledger Nano X account (Hardware wallet)
https://www.youtube.com/watch?v=GPpZxOjvU10&ab_channel=Boxmining
• How to use Opensea
https://www.youtube.com/watch?v=2tBPp8MLS9E&ab_channel=DataSlayer
• How to use uniswap
https://www.youtube.com/watch?v=dcZ7kVC2-6g&ab_channel=EveryBitHelps

NFT FAQ
• I am an Artist, how do I create my own project? The best place to start that is easy to use is Opensea with their instant custom contracts. For more detailed developer-made websites and smart contracts please contact the Nova team.

• Is this all a fad? Ethereum enables peer-to-peer transactions without the need for a third party. This means you are entirely in charge of your own currency. In addition, NFTs are the first time in history a person can own a digital product. The Blockchain acts as a public ledger that is always online and searchable. 

• How can I avoid scams? The reality is scams are getting really good. Here are some quick tips. Never under no circumstances ever give out your seed phrase to anyone that asks. On discord be careful of direct messages, downloads and links that can hide malicious threats that can hack and drain your wallets. 

• I think my NFT was stolen what can I do? At this stage it’s the wild west or digital gold rush. If your funds or NFTs are stolen the only way is to track who stole it via the blockchain. However this may be much harder to achieve as scammers are able to cover their tracks. Talking directly to NFT communities in discords can be beneficial as people may work together to track down the person responsible. 

• Where do I go to view my NFT? Once you connect your wallet to Opensea webpage you can view your profile of NFTs. 

ACRONYMS
• NFT – Non Fungible Token
• ETH- Ether
• DAPP – Decentralized Application
• DAO – Decentralized Autonomous Organisation
• FOMO – Fear of missing out
• FUD – Fear, uncertainty, and Doubt
• DYOR – Do your own homework
• WAGMI – We are going to make it
• GMI – Going to make it

menu bar upgrade

modularize the menu bar so it is the same on all pages (one component for menu called by many components)

transaction error or success presentation

when a user stakes, unstakes, claimes, or sets approveAll there should be a small popup what shows for 5 seconds after success. If the transaction failed, the popup should stay until an X button is clicked in the popup. The popup should be green when successful and read ( successful) or if failed it should be red and read ( failed. )

Modularize team grabbing service

right now we create 5 variables, from 5 functions to handle 5 team members. There should be one component which wraps up a set up functions instead. It should live in it's own component not hoepage.component.ts

setApproveAll should only be done once

check out the object returned by getStakerWallet - there should be a toggle whether the account is Approved for interaction on chain

if approved do not show the setApprove button, instead allow staking interaction

Unstaking

  1. view all staked nfts (there's a call in the smart contract to do this use ether.js NOT moralis)
  2. show staking rewards (probably with a calculator, save this later)
  3. unstake selected nfts (via ether.js)

staking page / ux upgrades

when metamask is active

  • darken page and dissable interactions
  • show status of transaction (waiting for user, waiting for transaction)
  • show NOVA loading spinner (gif or animated css tbd)
  • after transaction completes enable page AND reload from moralis (make sure we're not allowing people to submit two transactions to stake, unstake, claim the until the transaction is completed and we check blockchain state)

site loader

blank out site and spin novadao logo while content is loading or transaction is waiting -- #32 is relevant

unified popups

add the substack ifrrame to a popup that comes 5s after site finishes loading
use the same popups we're using for errors
move all relevant css to the popup css
all popups should be centered in screen

timeline fix

timeline on homepage seems to have broken along the way

staking checklist UX

when user is not logged in, show login button (connect wallet)
when user is logged in and moralis is loading show loading spinner or at least text
when checklist returns empty show message "No NFTs under contract . Procure an NFT or contact support through ."

education page og

create a new page to show off educational content

details to follow

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.