Skip to content

Commit 12faa0c

Browse files
urko94urko94
committed
Initial commit
0 parents  commit 12faa0c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+23143
-0
lines changed

‎.eslintrc.js

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
module.exports = {
2+
root: true,
3+
env: {
4+
browser: true,
5+
node: true,
6+
},
7+
extends: [
8+
'@nuxtjs/eslint-config-typescript',
9+
'plugin:nuxt/recommended',
10+
'prettier',
11+
'plugin:vue/recommended',
12+
],
13+
plugins: ['prettier'],
14+
rules: {
15+
'vue/no-v-html': 0,
16+
'vue/singleline-html-element-content-newline': 0,
17+
'vue/multi-word-component-names': 0,
18+
'vue/html-indent': 0,
19+
'vue/max-attributes-per-line': 0,
20+
'vue/no-multiple-template-root': 0,
21+
'vue/no-v-model-argument': 0,
22+
'vue/html-self-closing': [
23+
'error',
24+
{
25+
html: {
26+
void: 'any',
27+
normal: 'any',
28+
component: 'always',
29+
},
30+
svg: 'any',
31+
math: 'always',
32+
},
33+
],
34+
'prettier/prettier': [
35+
'error',
36+
{
37+
endOfLine: 'auto',
38+
},
39+
],
40+
'no-console': 0,
41+
},
42+
};

‎.gitignore

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
# These are some examples of commonly ignored file patterns.
2+
# You should customize this list as applicable to your project.
3+
# Learn more about .gitignore:
4+
# https://www.atlassian.com/git/tutorials/saving-changes/gitignore
5+
6+
# Node artifact files
7+
node_modules/
8+
dist/
9+
10+
# Compiled Java class files
11+
*.class
12+
13+
# Compiled Python bytecode
14+
*.py[cod]
15+
16+
# Log files
17+
*.log
18+
19+
# Package files
20+
*.jar
21+
22+
# Maven
23+
target/
24+
dist/
25+
26+
# JetBrains IDE
27+
.idea/
28+
29+
# Unit test reports
30+
TEST*.xml
31+
32+
# Generated by MacOS
33+
.DS_Store
34+
35+
# Generated by Windows
36+
Thumbs.db
37+
38+
# Applications
39+
*.app
40+
*.exe
41+
*.war
42+
43+
# Large media files
44+
*.mp4
45+
*.tiff
46+
*.avi
47+
*.flv
48+
*.mov
49+
*.wmv
50+
51+
# Custom
52+
*.log*
53+
.nuxt
54+
.nitro
55+
.cache
56+
.output
57+
.env
58+
.eslintcache
59+
stats.html
60+
dist

‎.nvmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
v16.16.0

‎.prettierignore

+96
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
###
2+
# Place your Prettier ignore content here
3+
4+
###
5+
# .gitignore content is duplicated here due to https://github.com/prettier/prettier/issues/8506
6+
7+
# Created by .ignore support plugin (hsz.mobi)
8+
### Node template
9+
# Logs
10+
/logs
11+
*.log
12+
npm-debug.log*
13+
yarn-debug.log*
14+
yarn-error.log*
15+
16+
# Runtime data
17+
pids
18+
*.pid
19+
*.seed
20+
*.pid.lock
21+
22+
# Directory for instrumented libs generated by jscoverage/JSCover
23+
lib-cov
24+
25+
# Coverage directory used by tools like istanbul
26+
coverage
27+
28+
# nyc test coverage
29+
.nyc_output
30+
31+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
32+
.grunt
33+
34+
# Bower dependency directory (https://bower.io/)
35+
bower_components
36+
37+
# node-waf configuration
38+
.lock-wscript
39+
40+
# Compiled binary addons (https://nodejs.org/api/addons.html)
41+
build/Release
42+
43+
# Dependency directories
44+
node_modules/
45+
jspm_packages/
46+
47+
# TypeScript v1 declaration files
48+
typings/
49+
50+
# Optional npm cache directory
51+
.npm
52+
53+
# Optional eslint cache
54+
.eslintcache
55+
56+
# Optional REPL history
57+
.node_repl_history
58+
59+
# Output of 'npm pack'
60+
*.tgz
61+
62+
# Yarn Integrity file
63+
.yarn-integrity
64+
65+
# dotenv environment variables file
66+
.env
67+
68+
# parcel-bundler cache (https://parceljs.org/)
69+
.cache
70+
71+
# next.js build output
72+
.next
73+
74+
# nuxt.js build output
75+
.nuxt
76+
77+
# Nuxt generate
78+
dist
79+
80+
# vuepress build output
81+
.vuepress/dist
82+
83+
# Serverless directories
84+
.serverless
85+
86+
# IDE / Editor
87+
.idea
88+
89+
# Service worker
90+
sw.*
91+
92+
# macOS
93+
.DS_Store
94+
95+
# Vim swap files
96+
*.swp

‎.prettierrc

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"arrowParens": "avoid",
3+
"singleQuote": true,
4+
"trailingComma": "es5",
5+
"semi": true,
6+
"twConfig": "./tailwind.config.js",
7+
"printWidth": 100
8+
}

‎.vscode/extensions.json

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"recommendations": [
3+
"vue.volar",
4+
"bradlc.vscode-tailwindcss",
5+
"dbaeumer.vscode-eslint",
6+
"esbenp.prettier-vscode",
7+
"csstools.postcss"
8+
]
9+
}

‎.vscode/settings.json

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"editor.codeActionsOnSave": {
3+
"source.fixAll": true
4+
},
5+
"editor.formatOnSave": true,
6+
"editor.defaultFormatter": "esbenp.prettier-vscode",
7+
"i18n-ally.localesPaths": ["locales"],
8+
"i18n-ally.keystyle": "nested",
9+
"cSpell.words": ["hcaptcha"],
10+
"html.format.wrapLineLength": 140
11+
}

‎README.md

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
# NFT website template
2+
3+
This is a simple website template for getting NFT information directly from chain. It uses wallet (like metamask) to assure NFT connection.
4+
5+
## Acquire website files
6+
7+
### Basic
8+
9+
If you have no experience with git and would still like to use our template file to enable your freshly deployed NFT collection, feel free to click the green button "Code" on the upper right corner of this website and then selecting "Download ZIP".
10+
Once downloaded, the zip file includes all files you need to display your NFT collection. Before that happens you need to configure the file, as explained in Configure section.
11+
12+
### Advanced
13+
14+
1. Fork the repo
15+
2. Configure config/production.ts
16+
3. Make changes to the website (optional)
17+
4. Deploy files to Apillon hosting
18+
19+
## Configure
20+
21+
Before the template can interact with the Smart Contract you have deployed via UI, it needs to be manually configured.
22+
23+
To configure the template, do the following:
24+
25+
1. Open the template folder "config"
26+
2. Locate production.ts file within the config folder
27+
3. Open the production.ts file in code editor
28+
4. Change the first line by entering your smart contract address between parenthesis
29+
5. Select the chain version by commenting and uncommenting the right chain
30+
31+
Example:
32+
33+
```sh
34+
NFT_ADDRESS = ""; // Paste the address of the NFT collection between the parenthesis
35+
36+
// uncomment the chain you are using by deleting the slashes
37+
// CHAIN_ID = "0x507"; // Moonbase
38+
// CHAIN_ID = "0x504"; // Moonbeam
39+
// CHAIN_ID = "0x250"; // Astar
40+
```
41+
42+
Once you have updated the config/${env}.ts file, save it. Now the website files are ready to be deployed.
43+
​
44+
45+
## Preview the website on your computer
46+
47+
Before uploading the website to Apillon hosting, feel free to edit the code, add any customization or just review whether everything works as expected.
48+
49+
To preview the website on your computer you need to serve a http server from the root folder of the website. For example, you can run node package http-server from root folder like this:
50+
51+
```sh
52+
npm run dev
53+
```
54+
55+
## Deploy to Apillon Hosting
56+
57+
### Basic
58+
59+
1. If not already, register to [Apillon.io](https://app.apillon.io)
60+
2. Log in to Apillon console and create new Hosting bucket inside your project.
61+
3. Select all files of your website (as configured in the previous step) and use drag&drop action to pull the files into the Hosting bucket
62+
4. Once the files are uploaded, push them to Staging and finally to the Production
63+
5. Add your custom domain (as displayed in the dashboards UI)
64+
6. Review your newly deployed website
65+
66+
### Advanced
67+
68+
To deploy your NFT website to Apillon Hosting you should:
69+
70+
1. Clone this repository and [configure](#configure) it to your needs.
71+
2. If not already, register to [Apillon.io](https://app.apillon.io)
72+
3. Log in to Apillon console and create new Hosting bucket inside your project.
73+
4. In settings, create an API KEY with storage permissions. Write down API key and API secret.
74+
5. In your github repository setup actions secrets (variables)
75+
- WEBSITE_UUID : copy UUID from hosting bucket on Apillon dashboard
76+
- APILLON_API_KEY : your previously created API key
77+
- APILLON_API_SECRET : your previously created API secret
78+
79+
Now everything should be ready. When you will push to master branch, your website should start deploy to Apillon IPFS hosting. Monitor progress on [Apillon.io](https://app.apillon.io) dashboard. After some time you'll be able to get IPNS url and also setup your own domain.
80+
81+
You can change behavior of the automatic deployment by editing [/.github/workflows/deploy.yml](/.github/workflows/deploy.yml).

‎app.vue

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<template>
2+
<div id="app" class="bg-bg">
3+
<NuxtLayout>
4+
<NuxtPage />
5+
</NuxtLayout>
6+
</div>
7+
</template>
8+
9+
<script lang="ts" setup>
10+
</script>

0 commit comments

Comments
 (0)