kluu1

const cart1 = ['mouse', 'keyboard'];
const cart2 = ['monitor', 'speakers', 'charger'];
const cart3 = ['cables', 'mouse pad']

const combinedCarts = cart1.concat(cart2, cart3);

console.log(combinedCarts); // ["mouse", "keyboard", "monitor", "speakers", "charger", "cables", "mouse pad"]

kluu1

import Head from 'next/head'
import { Container } from 'semantic-ui-react'
import Header from './Header'

const styles = {
  container: {
    paddingTop: '1em',
    paddingBottom: '1em',
    minWidth: '100%'
  }

kluu1

import App from 'next/app'
import { ApolloProvider } from '@apollo/react-hooks';
import { Container} from 'semantic-ui-react'
import withData from '../utils/apollo-client';
import Layout from '../components/_App/Layout'

class MyApp extends App {
  render() {
    const { Component, apollo } = this.props

kluu1

import { Menu, Container } from 'semantic-ui-react'
import Link from 'next/link'

function Header() {
  return (
    <Menu color="blue" inverted borderless>
      <Container textAlign="left">
        <Link href="/">
          <Menu.Item style={{ paddingLeft: 0 }}>
            <h1>Next Crypto Tracker</h1>

kluu1

module.exports = {
  env: {
    MONGO_URI: <YOUR MONGODB CONNECTION STRING GOES HERE>,
    API_KEY: <YOUR NOMICS API KEY GOES HERE>
  }
};

kluu1

import { gql } from 'apollo-server-micro'

const typeDefs = gql`
  type Coin {
    id: String!
    currency: String!
    name: String!
    logo_url: String!
    rank: String!
    price: String!

kluu1

import Nomics from 'nomics'

const nomics = new Nomics({
  apiKey: process.env.API_KEY
})

const resolvers = {
  Query: {
    getCoins: async (_, args) => {
      // fetches all coins from nomics

kluu1

import { ApolloServer } from 'apollo-server-micro'
import resolvers from './resolvers'
import typeDefs from './typeDefs'

const apolloServer = new ApolloServer({
  typeDefs,
  resolvers
})

const server = apolloServer.createHandler({ path: '/api/graphql' })

kluu1

import { ApolloClient } from 'apollo-client'
import { InMemoryCache } from 'apollo-cache-inmemory'
import withApollo from 'next-with-apollo'
import { createHttpLink } from 'apollo-link-http'
import fetch from 'isomorphic-unfetch'

const GRAPHQL_URL = '/api/graphql'

const link = createHttpLink({
  fetch, // Switches between unfetch & node-fetch for client & server.

kluu1

import React from 'react'
import { useQuery } from '@apollo/react-hooks'
import { Loader, Divider } from 'semantic-ui-react'
import CoinsTable from '../components/Index/CoinsTable'
import { GET_COINS_QUERY } from '../utils/queries'

export default () => {
  const { data, loading, error } = useQuery(GET_COINS_QUERY, {
    fetchPolicy: 'network-only',
    pollInterval: 5000,