基于区块链的毕业设计👋 Welcome to ethereum.org! – 👋 欢迎来到以太坊.org!
本文提供基于区块链的毕业设计国外最新区块链项目源码下载,包括solidity,eth,fabric等blockchain区块链,基于区块链的毕业设计👋 Welcome to ethereum.org! – 👋 欢迎来到以太坊.org! 是一篇很好的国外资料
以太坊eth.org!”>
以太坊eth.org!”>
以太坊eth.org!”>
以太坊eth.org!”>
以太坊eth.org!”>
This is the repo for the ethereum.org website, a resource for the Ethereum community. The purpose of the site is to “Be the best portal to Ethereum for our growing global community” – read more about what this means here.
ethereum.org is improved and changed over time through the contributions of community members who submit content, give feedback, or volunteer their time to managing its evolution. If you’re interested in helping to improve ethereum.org, find out how to contribute.
Looking for the Ethereum blockchain’s code?
If you’re looking for the Ethereum blockchain itself, there is no single repo. Instead, Ethereum has multiple implementations of the protocol written in different programming languages for security and diversity. Check out the different implementations
How to contribute
This project follows the all-contributors specification. Contributions of any kind welcome!
How updates are made to ethereum.org:
Submit an issue
- Create a new issue
- Comment on the issue (if you’d like to be assigned to it) – that way our team can assign the issue to you.
Fork the repository (repo)
- If you’re not sure, here’s how to fork the repo
Set up your local environment (optional)
If you’re ready to contribute and create your PR, it will help to set up a local environment so you can see your changes.
-
Set up your development environment
-
Clone your fork
If this is your first time forking our repo, this is all you need to do for this step:
$ git clone git@github.com:[your_github_handle]/ethereum-org-website.git && cd ethereum-org-website
If you’ve already forked the repo, you’ll want to ensure your fork is configured and that it’s up to date. This will save you the headache of potential merge conflicts.
To configure your fork:
$ git remote add upstream https://github.com/ethereum/ethereum-org-website.git
To sync your fork with the latest changes:
$ git checkout dev $ git fetch upstream $ git merge upstream/dev
- Install dependencies
$ yarn
- Add personal GitHub API token (free)
This is required to run the project locally, as we use the GitHub API to fetch repository data for many projects.
- Follow these instructions to create a personal GitHub API token
- When selecting scopes in step 7, leave everything unchecked (the data we fetch doesn’t require any scope)
- In local repo root directory: Make a copy of
.env.example
and name it.env
- Copy & paste your new GitHub API token in
.env
// .env Example: GITHUB_TOKEN_READ_ONLY_DEV=48f84de812090000demo00000000697cf6e6a059
Make awesome changes!
- Create new branch for your changes
$ git checkout -b new_branch_name
- Start developing!
$ yarn start
- Open this directory in your favorite text editor / IDE, and see your changes live by visiting
localhost:8000
from your browser - Pro Tip: Explore scripts within
package.json
for more build options
- Commit and prepare for pull request (PR). In your PR commit message, reference the issue it resolves (see how to link a commit message to an issue using a keyword.
$ git commit -m "brief description of changes [Fixes #1234]"
- Push to your GitHub account
$ git push
Submit your PR
- After your changes are commited to your GitHub fork, submit a pull request (PR) to the
dev
branch of theethereum/ethereum-org-website
repo - In your PR description, reference the issue it resolves (see linking a pull request to an issue using a keyword)
- ex.
Updates out of date content [Fixes #1234]
- ex.
- Netlify (our hosting service) deploys all PRs to a publicly accessible preview URL, e.g.:
以太坊eth.org!”>
- Confirm your Netlify preview deploy looks & functions as expected
- Why not say hi and draw attention to your PR in our discord server?
Wait for review
- The website team reviews every PR
- See how decisions are made on content changes
- Acceptable PRs will be approved & merged into the
dev
branch
Release
master
is continually synced to Netlify and will automatically deploy new commits to ethereum.org- The website team will periodically merge
dev
intomaster
(typically multiple times per week) - You can view the history of releases, which include PR highlights
The ethereum.org website stack
- Node.js
- Yarn package manager
- Gatsby
- Manages page builds and deployment
- Configurable in
gatsby-node.js
,gatsby-browser.js
,gatsby-config.js
, andgatsby-ssr.js
- Gatsby Tutorial
- Gatsby Docs
- React – A JavaScript library for building component-based user interfaces
- GraphQL – A query language for APIs
- Algolia – Site indexing, rapid intra-site search results, and search analytics
- Primary implementation:
/src/components/Search/index.js
- Primary implementation:
- Crowdin – crowdsourcing for our translation efforts (See “Translation initiative” below)
- Github Actions – Manages CI/CD, and issue tracking
- Netlify – DNS management and primary host for
master
build. Also provides automatic preview deployments for all pull requests
Code structure
Folder | Primary use |
---|---|
/src |
Main source folder for development |
/src/assets |
Image assets |
/src/components |
React components that do not function as stand alone pages |
/src/content |
Markdown/MDX files for site content stored here. For example: ethereum.org/en/about/ is built from src/content/about/index.md The markdown files are parsed and rendered by src/templates/static.js * |
/src/content/developers/docs |
*Markdown files in here use the Docs template: src/templates/docs.js |
/src/content/developers/tutorials |
*Markdown files in here use the Tutorial template: src/templates/tutorial.js |
/src/data |
General data files importable by components |
/src/hooks |
Custom React hooks |
/src/intl |
Language translation JSON files |
/src/lambda |
Lambda function scripts for API calls |
/src/pages /src/pages-conditional |
React components that function as stand alone pages. For example: ethereum.org/en/wallets/find-wallet is built from src/pages/wallets/find-wallet.js |
/src/scripts /src/utils |
Custom utility scripts |
/src/styles |
Stores layout.css which contains root level css styling |
/src/templates |
JSX templates that define layouts of differnt regions of the site |
/src/theme.js |
Declares site color themes, breakpoints and other constants (try to utilize these colors first) |
Website conventions / best practices
❗️ Translation initiative
Please read carefully if adding or altering any written language content
How to prepare your content for translation depends on whether you’re working on a simple Markdown/MDX page or a React component page.
– MDX pages (/src/content/page/
)
Markdown will be translated as whole pages of content, so no specific action is required. Simply create a new folder within /src/content/
with the name of the page, then place index markdown file (ie. index.md
) within new folder.
– React component page
-
English text should be placed into
/src/intl/en/page-CORRESPONDING-PAGE.json
-
Crowdin is the platform we use to manage & crowdsource translation efforts. Please use the following conventions to help streamline this process.
-
Use kebab casing (utilizing-dashes-between-words) for file names and JSON keys
-
Use standard sentence casing for entry values
- If capitalization styling required, it is preferable to style with CSS
- Do this:
JSON `"page-warning": "Be very careful"` CSS `text-transform: uppercase`
- Not this:
JSON `"page-warning": "BE VERY CAREFUL"`
- Do this:
- This minimizes issues during translation, and allows consistent styling to all languages
- If capitalization styling required, it is preferable to style with CSS
-
Please avoid embedding links within a sentence. For a word/phrase to be a link, it requires a key/string in the intl JSON. If this is in the middle of another sentence, this results in the sentence being broken into multiple pieces, and requires coding the sentence structure into the JavaScript.
- This results in significant challenges during translation process, as written syntax for each language will very in terms of ordering subjects/verbs/etc.
- If you’re wanting to link to something within your sentence, create a link at the end of the sentence or paragraph:
<p>All Ethereum transactions require a fee, known as Gas, that gets paid to the miner. <Link to="link">More on Gas</Link></p>
Once, you’ve addded your English content to the appropriate JSON file, the above code should look something more like:
<p><Translation id="page-transactions" />{" "}<Link to="link"><Translation id="page-transactions-gas-link" /></Link></p>
- tl;dr Each individual JSON entry should be a complete phrase by itself
-
This is done using the
Translation
component. However there is an alternative method for regular JS:gatsby-plugin-intl
with/src/utils/translations.js
-
Method one:
<Translation />
component (preferred if only needed in JSX)import { Translation } from "src/components/Translation" // Utilize in JSX using <Translation id="language-json-key" />
-
Method two:
translateMessageId()
import { useIntl } from "gatsby-plugin-intl" import { translateMessageId } from "src/utils/translations" // Utilize anywhere in JS using const intl = useIntl() translateMessageId("language-json-key", intl)
const siteTitle = translateMessageId("site-title", intl)
-
React Hooks
- Components and pages are written using arrow function syntax with React hooks in lieu of using class-based components
// Example import React, { useState, useEffect } from 'react' const ComponentName = props => { // useState hook for managing state variables const [greeting, setGreeting] = useState('') useEffect(() => { // useEffect hook for handling component lifecycle setGreeting('Hello world') }, []) return <div>{greeting}</div> }; export default ComponentName;
Styling
-
src/theme.js
– Declares site color themes, breakpoints and other constants (try to utilize these colors first) -
We use styled-components
- Tagged template literals are used to style custom components
// Example of styling syntax using styled-components import styled from "styled-components" const GenericButton = styled.div` width: 200px; height: 50px; ` const PrimaryButton = styled(GenericButton)` background: blue; ` const SecondaryButton = styled(GenericButton)` background: red; ` // These are each components, capitalized by convention, and can be used within JSX code // ie: <PrimaryButton>Text</PrimaryButton>
- Recommended VS Code Plugin:
vscode-styled-components
To install: Open VS Code >Ctrl+P
/Cmd+P
> Run:ext install vscode-styled-components
-
Values from
src/theme.js
are automatically passed as a prop object to styled components// Example of theme.js usage import styled from "styled-components" const Container = styled.div` background: ${(props) => props.theme.colors.background}; @media (max-width: ${(props) => props.theme.breakpoints.s}) { font-size: #{(props) => props.theme.fontSized.s}; } `
-
Framer Motion – An open source and production-ready motion library for React on the web, used for our animated designs
-
Emojis: We use Twemoji, an open-source emoji set created by Twitter. These are hosted by us, and used to provide a consistent experience across operating systems.
// Example of emoji use import Emoji from "./Emoji" // Within JSX: <Emoji text=":star:" size={1} /> // sized in `em`
- Icons: We use React Icons
src/components/Icon.js
is the component used to import icons to be used- If an icon you want to use is not listed you will need to add it to this file
src/components/Icon.js
:
// Example of how to add new icon not listed import { ZzIconName } from "react-icons/zz" // Then add to IconContect.Provider children: {name === "alias" && <ZzIconName />}
From React component:
// Example of icon use import Icon from "./Icon" // Within JSX: <Icon name="alias" />
Image loading and API calls using GraphQL
- Gatsby + GraphQL used for loading of images and preferred for API calls (in lieu of REST, if possible/practical). Utilizes static page queries that run at build time, not at run time, optimizing performance
- Image loading example:
import { graphql } from "gatsby" export const query = graphql` query { hero: file(relativePath: { eq: "developers-eth-blocks.png" }) { childImageSharp { fluid(maxWidth: 800) { ...GatsbyImageSharpFluid } } } } ` // These query results get passed as an object `props.data` to your component
- API call example:
import { graphql } from "gatsby" export const repoInfo = graphql` fragment repoInfo on GitHub_Repository { stargazerCount languages(orderBy: { field: SIZE, direction: DESC }, first: 2) { nodes { name } } url } ` export const query = graphql` query { hardhatGitHub: github { repository(owner: "nomiclabs", name: "hardhat") { ...repoInfo } } } ` // These query results get passed as an object `props.data` to your component
以太坊eth.org!”>
Claim your POAP!
What is POAP?
The Proof of Attendance Protocol is a dapp that distributes badges in the form of ERC-721 tokens to prove you participated in an event. More on POAPs.
ethereum.org 2020 Contributor POAP
-
If you commited any changes in 2020 that were merged into our repo, you have a POAP waiting!
-
This includes our dedicated translators on Crowdin
以太坊eth.org!”>
-
👆 To claim your Contributor POAP, join our Discord server and paste a link to your contribution in the #poaps-🏆 channel -
A member of our team will verify the request and DM you with a peronalized link to claim your own freshly minted POAP collectible!
Coming soon: 2021 POAPs
- Stay tuned for details!
Contributors
Thanks goes to these wonderful people (emoji key):
ExodusActual |
Anna Karpińska |
8bitp |
Rousos Alexandros |
EvanVanNessEth |
JesseAbram |
Lililashka |
vrde |
Richard McSorley |
Alejandro Santander |
Jason Carver |
Chaitanya Potti |
chriseth |
Craig Williams |
Damian Rusinek |
Danny Ryan |
Franco Zeoli |
Guy Lando |
James Connolly |
Jacob Burden |
joshorig |
mariapaulafn |
Martín |
Mattias Nystrom |
nabetse |
Nick Savers |
Nina Breznik |
Ven Gist |
Paul Fletcher-Hill |
Phil |
Rémi Prévost |
Shane |
Andrey Petrov |
Santiago Palladino |
Tim Beiko |
Wanseob Lim |
Wil Barnes |
Aniket |
Chris Chinchilla |
George Spasov |
Pierrick TURELIER |
Solexplorer |
Sunghee Lee |
awallendahl |
Boris Mann |
carumusan |
econoar |
Gustavo Esquinca |
Javier Tarazaga |
Kendall Cole |
Brendan Lee |
Mahesh Murthy |
Patrick Gallagher |
Ali Abbas |
wtf |
Aleksandr Sobolev |
Zak Cole |
Bogdan Habic |
Nick Sawinyh |
Miguel Angel Gordián |
Eswara Sai |
ethers |
Felipe Faraggi |
Maurelian |
CPSTL |
Hudson Jameson |
Shayan Eskandari |
Lukas Sägesser |
Virgil Griffith |
Eugene Aseev |
Jannis Pohlmann |
think-in-universe |
Josh Stark |
Alan Woo |
Manank Patni |
Rogério Araújo |
Natacha Souza |
sorumfactory |
Sam Richards |
Antonio Della Porta |
Abhimanyu Shekhawat |
William Entriken |
Sangphil Kim |
peijie |
Jokyash |
Pedro Rivera |
Gabriele Rigo |
Tilen Držan |
jJosko1986 |
ECN |
Damiano Azzolini |
matteopey |
Hun Ryu |
nake13 |
alexiskefalas |
Behrad Khodayar |
Frankaus |
hacktar |
Jaroslav Macej |
Eman Herawy |
Bellinas |
Alexander Cherkashin |
Enoch Mbaebie |
inlak16 |
Bob Jiang |
Suhun Kim |
Jean Zundel |
Hachemi |
hanzoh |
Vincent Le Gallic |
Enigmatic331 |
Ganesh Prasad Kumble |
Pandiyaraja Ramamoorthy |
Archan Roychoudhury |
SAI PRASHANTH VUPPALA |
Sayid Almahdy |
jeedani |
Akira |
karansinghgit |
Marc Garreau |
mul53 |
Apoorv Lathey |
Ken Sato |
Sesamestrong |
ChrisK |
Stefan van As |
Grégoire Jeanmart |
nysxah |
Rachel |
wschwab |
Edson Ayllon |
Peteris Erins |
jimmyshi |
Jefte Costa |
Jinho Jang |
Julien Klepatch |
Yaz Khoury |
Yos Riady |
Andrew Cohen |
Wesley van Heije |
gr0uch0dev |
sooyoung |
Adria Massanet |
Alex Singh |
Carl Fairclough |
Kaven C |
Markus Hatvan |
Evans Tucker |
Adina Cretu |
tvanepps |
Victor Guyard ️️️️ |
Abhranil Das |
Ahmet Emin Koçal |
Aqeel |
Linda Xie |
Ian Eck |
Chris Waring |
Ev |
Ivan Martinez |
Sebastian T F |
Anett Rolikova |
Pooja Ranjan |
sassal |
Robert Zaremba |
Tas |
Sylvain Pace |
Sina Habibian |
Dennison Bertram |
Artur Gontijo |
ethjoe |
cooganb |
drequinox |
Tarun Gupta |
Jamie Pitts |
Chris Seifert |
John Craig |
Noam Eppel |
Jacob Willemsma |
Alex |
Paul Razvan Berg |
ph5500 |
John Monarch |
Shadab Khan |
ryancreatescopy |
Hammad Jutt |
Becaz |
Caos |
codingsh |
Artem |
Cristian Espinoza Garner |
Daniel Schlabach |
Marius van der Wijden |
Markus Waas |
Keith Yeung |
Jordan Lyall |
elanh |
Mohamed Hayibor |
Conor Svensson |
Aranha |
Jung Sup (James) Yoo |
Veit Progl |
jcamilli |
Martin Holst Swende |
Steven Gilbert |
Sacha Saint-Leger |
Griffin Ichiba Hotchkiss |
Scott Bigelow |
Harikrishnan Mulackal |
Matthieu Caneill |
Arjuna Sky Kok |
Brian Gu |
Gonçalo Hora de Carvalho |
Mário Havel |
JosefJ |
Christoph Burgdorf |
slipperybeluga |
David Liu |
shreyashariharan3 |
Adrián Calvo |
daviroo |
Wim Notredame |
vasa |
Franziska Heintel |
Muhammad Umair Irshad |
Nazzareno Massari |
Mayemene Fomene Jean Vladimir |
Yahsin Huang |
James Zaki |
Greg Lang |
Matt Voska |
mustafa |
Paul Wackerow |
Attaphong Rattanaveerachanon |
LoinLiao |
DrMad92 |
Patricio Palladino |
David Murdoch |
MashhoodIjaz |
Dan Nolan |
Marek Kirejczyk |
Jon Cursi |
James Farrell |
Xavi Arias Seguí |
ANKIT_PAL |
İsmail Kerim Cem |
Joanne |
michael60634 |
Andrei Maiboroda |
Anki |
Michelle Plur |
PAAlmasi |
Ben Edgington |
alexsantee |
peth-yursick |
Alwin Stockinger |
Roberto Henríquez Perozo |
strykerin |
jddxf |
LucasRoorda |
Mihir Luthra |
tentodev |
MiZiet |
Vaibhav Chopra |
Lakshman Sankar |
hewigovens |
DragonDev1906 |
Ryan Ghods |
Oliver |
Kristiyan |
Matthieu Riou |
pansay |
eirtscience |
Francis Lewis |
baub |
lamone |
Sean O’Connor |
Tara Rowell |
Aleksi Cohen |
Kartikaya Gupta (kats) |
siddhantkharode |
Renan Dincer |
Zhangyuan Nie |
Patrick Collins |
Sant Deleon |
Martin Huschenbett |
Kalle Moen |
Vitaly |
Nikolay Yushkevich |
darkwater4213 |
Akash Nimare |
Dave Mackey |
Emanuel Tesař |
DeFiDude |
Austin Griffith |
Chase Manning |
Colin Steil |
MonarthS |
Adam Dry |
Nikolai Vavilov |
Katie |
comeToThinkOfEth |
catsnackattack |
Maurycy |
Igor Papandinas |
Tahir Alvi |
amirmehdi |
Dan Dadybaev |
Finley |
nobd |
Alexander Sadovskyi |
Ethan Sarif-Kattan |
C.J. Kozarski |
Yakko Majuri |
John Adler |
Just some guy |
Vedvardhan |
Yussuf Elarif |
David Awad |
Alex Beregszaszi |
Adam Goth |
Anurag Pal |
Vishal Pratap Singh |
qbzzt |
Ewa Kowalska |
Aheesh |
tophersjones |
Andrew Yang |
$hoot->Pairs |
NilsKaden |
Stuart Reynolds |
Gwenael Le Bodic |
Anurag Verma |
Nikolai Golub |
Elliot Lee |
Viktor Garske |
Kristjan Grm |
Mac L |
Bruce MacDonald |
Ronnie Sherfey |
Ali Rahman |
Erik Vandeputte |
TM Lee |
mic0des |
Hakeem Almidan |
Julien Rioux |
Justin Chow |
Gabi |
Rohit Gopal |
Jordan Overbye |
This project follows the all-contributors specification. Contributions of any kind welcome!
Join our Discord server
We have a space to discuss all things ethereum.org – share your ideas or just say hi over on Discord.
Merge pull request
以太坊eth.org!”>
以太坊eth.org!”><
>
以太坊eth.org!”>
以太坊eth.org!”>👋 欢迎来到以太坊eth.org!
这是以太坊eth.org网站,以太坊eth社区的资源。该网站的目的是“成为我们日益增长的全球社区通往以太坊eth的最佳门户”——阅读更多关于这意味着什么的信息。
以太坊eth.org通过社区成员提交内容、提供反馈或自愿花时间来管理其演变,随着时间的推移,信息会得到改进和改变。如果你有兴趣帮助改善以太坊eth.org,了解如何贡献。
寻找以太坊eth区块链blockchain的代码?
如果您正在寻找以太坊eth区块链blockchain本身,则不存在单一回购。相反,以太坊eth使用不同的编程语言编写了多个协议实现,以实现安全性和多样性。查看不同的实现
如何贡献
此项目遵循所有贡献者规范。任何形式的贡献欢迎!
如何更新以太坊eth.org:
提交一个问题
- 如果您不确定,下面介绍如何分叉repo
- 设置开发环境
分叉存储库(repo)
- 克隆分叉
设置本地环境(可选)
如果您准备好贡献和创建您的公关,它将有助于建立一个本地环境,以便您可以看到您的更改。
- 安装依赖项
- 添加个人GitHub API令牌(免费)
如果这是您第一次分叉我们的repo,则此步骤只需执行以下操作:
$ git clone git@github.com:[your_github_handle]/ethereum-org-website.git && cd ethereum-org-website
如果您已经分叉repo,则需要确保您的fork已配置并且是最新的。这将使您省去潜在合并冲突的麻烦。
要配置fork:
$ git remote add upstream https://github.com/ethereum/ethereum-org-website.git
要将fork与最新更改同步:
$ git checkout dev $ git fetch upstream $ git merge upstream/dev
- 按照以下说明创建个人GitHub API令牌在步骤7中选择作用域时,保留所有内容未选中(我们获取的数据不需要任何作用域)
$ yarn
- 在步骤7中选择作用域时,将所有内容都未选中(我们获取的数据不需要任何作用域)
本地运行项目需要这样做,因为我们使用GitHub API获取许多项目的存储库数据。
- 保留在本地repo根目录中:制作的副本。环境示例并将其命名为.env
- 中复制并粘贴新的GitHub API令牌创建新的为您的变化支招
- 开始开发!
// .env Example: GITHUB_TOKEN_READ_ONLY_DEV=48f84de812090000demo00000000697cf6e6a059
进行很棒的更改!
- 在您喜爱的文本编辑器/IDE中打开此目录,通过访问本地主机:8000来自您的浏览器
$ git checkout -b new_branch_name
- 专业提示:浏览包.json有关更多生成选项,请提交并准备拉取请求(PR)。在PR commit消息中,引用它解决的问题(请参阅如何使用关键字将提交消息链接到问题)。
$ yarn start
- 在PR描述中,引用它解决的问题(请参阅使用关键字将拉取请求链接到问题),例如更新过期内容[Fixes#1234]
$ git commit -m "brief description of changes [Fixes #1234]"
- 例如更新过期内容[Fixes#1234]
$ git push
提交您的PR
- Netlify(我们的托管服务)将所有PR部署到可公开访问的预览URL,例如:
以太坊eth.org!”>
- 确认您的Netlify预览部署外观&;按预期运行
- 网站团队审查每一份PR
- 查看如何对内容更改做出决定
- 将批准可接受的PR&;合并到dev分支
等待审核
- 主服务器将持续同步到Netlify,并将自动将新提交部署到以太坊eth.org
- 网站团队将定期将dev合并到master中(通常每周多次)
- 您可以查看发布历史,其中包括公关亮点节点.js
发布以太坊eth.org网站栈
代码结构
网站惯例/最佳实践
❗️翻译计划
React Hooks
样式化
图像加载和使用GraphQL的API调用
声明您的POAP!什么是POAP?
- 纱线包管理器
- Gatsby管理可在Gatsby中配置的页面构建和部署-节点.js,盖茨比-浏览器.js,盖茨比-配置.js,还有盖茨比-ssr.js公司Gatsby教程Gatsby Docs
- 管理页面构建和部署
代码结构
- 可在Gatsby中配置-节点.js, 盖茨比-浏览器.js,盖茨比-配置.js,还有盖茨比-ssr.js公司
- 盖茨比教程
- 盖茨比文档
- 众包-我们翻译工作的众包(见下面的“翻译计划”)
- Github操作-管理CI/CD和问题跟踪
- Netlify-DNS管理以及主构建的主主机。还为所有请求提供自动预览部署
- Crowdin是我们用来管理众源翻译工作的平台。请使用以下约定来帮助简化此过程。
- 使用kebab大小写(利用单词之间的破折号)作为文件名和JSON键
- 如果需要大写样式,则使用标准句子大小写作为输入值,最好使用CSS样式,这样做:JSON`“page warning”:“小心”`CSS`文本转换:大写`Not this:JSON`“page warning”:“小心”`这样可以最大限度地减少翻译过程中的问题,并允许在需要大写样式的情况下对所有语言进行一致的样式设置
网站惯例/最佳实践
Folder | Primary use |
---|---|
/src |
Main source folder for development |
/src/assets |
Image assets |
/src/components |
React components that do not function as stand alone pages |
/src/content |
Markdown/MDX files for site content stored here. For example: ethereum.org/en/about/ is built from src/content/about/index.md The markdown files are parsed and rendered by src/templates/static.js * |
/src/content/developers/docs |
*Markdown files in here use the Docs template: src/templates/docs.js |
/src/content/developers/tutorials |
*Markdown files in here use the Tutorial template: src/templates/tutorial.js |
/src/data |
General data files importable by components |
/src/hooks |
Custom React hooks |
/src/intl |
Language translation JSON files |
/src/lambda |
Lambda function scripts for API calls |
/src/pages /src/pages-conditional |
React components that function as stand alone pages. For example: ethereum.org/en/wallets/find-wallet is built from src/pages/wallets/find-wallet.js |
/src/scripts /src/utils |
Custom utility scripts |
/src/styles |
Stores layout.css which contains root level css styling |
/src/templates |
JSX templates that define layouts of differnt regions of the site |
/src/theme.js |
Declares site color themes, breakpoints and other constants (try to utilize these colors first) |
❗️翻译计划
React Hooks
如果添加或更改任何书面语言内容,请仔细阅读
如何准备翻译内容取决于您使用的是简单的Markdown/MDX页面还是React组件页面。
-MDX页面(/src/content/page/)
降价将被翻译为内容的整个页面,因此不需要具体操作。只需在/src/content/中创建一个新文件夹,其中包含页面名称,然后放置索引标记文件(即。索引.md)在新文件夹中。
-React component page
- ,最好使用CSS样式:JSON`“page warning”:“小心”`
-
Crowdin是我们用来管理众源翻译工作的平台。请使用以下约定来帮助简化此过程。
-
使用kebab大小写(利用单词之间的破折号)作为文件名和JSON键
-
使用标准句子大小写作为输入值
- If capitalization styling required, it is preferable to style with CSS
- Do this:
JSON `"page-warning": "Be very careful"` CSS `text-transform: uppercase`
- Not this:
JSON `"page-warning": "BE VERY CAREFUL"`
- Do this:
- This minimizes issues during translation, and allows consistent styling to all languages
- If capitalization styling required, it is preferable to style with CSS
-
请避免在句子中嵌入链接。要使单词/短语成为链接,它需要intl JSON中的键/字符串。如果这是在另一个句子的中间,这将导致句子被分成多个部分,并且需要将句子结构编码到JavaScript中。
- This results in significant challenges during translation process, as written syntax for each language will very in terms of ordering subjects/verbs/etc.
- If you’re wanting to link to something within your sentence, create a link at the end of the sentence or paragraph:
<p>All Ethereum transactions require a fee, known as Gas, that gets paid to the miner. <Link to="link">More on Gas</Link></p>
一旦您将英语内容添加到相应的JSON文件中,上面的代码应该看起来更像:
<p><Translation id="page-transactions" />{" "}<Link to="link"><Translation id="page-transactions-gas-link" /></Link></p>
- tl;dr Each individual JSON entry should be a complete phrase by itself
-
这是使用Translation组件完成的。不过,对于常规JS还有另一种方法:gatsby plugin intl with/src/utils/翻译.js
-
方法一:<;Translation/>;组件(仅在JSX中需要时首选)
import { Translation } from "src/components/Translation" // Utilize in JSX using <Translation id="language-json-key" />
-
方法二:translateMessageId()
import { useIntl } from "gatsby-plugin-intl" import { translateMessageId } from "src/utils/translations" // Utilize anywhere in JS using const intl = useIntl() translateMessageId("language-json-key", intl)
const siteTitle = translateMessageId("site-title", intl)
-
样式化
- Components and pages are written using arrow function syntax with React hooks in lieu of using class-based components
// Example import React, { useState, useEffect } from 'react' const ComponentName = props => { // useState hook for managing state variables const [greeting, setGreeting] = useState('') useEffect(() => { // useEffect hook for handling component lifecycle setGreeting('Hello world') }, []) return <div>{greeting}</div> }; export default ComponentName;
图像加载和使用GraphQL的API调用
-
src/主题.js-声明站点颜色主题,断点和其他常量(首先尝试使用这些颜色)
-
我们使用src中的样式化组件/主题.js作为道具对象自动传递给样式化的组件,用于我们的动画设计
- Tagged template literals are used to style custom components
// Example of styling syntax using styled-components import styled from "styled-components" const GenericButton = styled.div` width: 200px; height: 50px; ` const PrimaryButton = styled(GenericButton)` background: blue; ` const SecondaryButton = styled(GenericButton)` background: red; ` // These are each components, capitalized by convention, and can be used within JSX code // ie: <PrimaryButton>Text</PrimaryButton>
- Recommended VS Code Plugin:
vscode-styled-components
To install: Open VS Code >Ctrl+P
/Cmd+P
> Run:ext install vscode-styled-components
-
表情符号:我们使用Twemoji,一个由Twitter创建的开源表情符号集。它们由我们托管,用于提供跨操作系统的一致体验。
// Example of theme.js usage import styled from "styled-components" const Container = styled.div` background: ${(props) => props.theme.colors.background}; @media (max-width: ${(props) => props.theme.breakpoints.s}) { font-size: #{(props) => props.theme.fontSized.s}; } `
-
src/组件/图标.js:
-
来自React组件:
// Example of emoji use import Emoji from "./Emoji" // Within JSX: <Emoji text=":star:" size={1} /> // sized in `em`
- Icons: We use React Icons
src/components/Icon.js
is the component used to import icons to be used- If an icon you want to use is not listed you will need to add it to this file
以太坊eth.org!”>
// Example of how to add new icon not listed import { ZzIconName } from "react-icons/zz" // Then add to IconContect.Provider children: {name === "alias" && <ZzIconName />}
出席证明协议是一个dapp,它以ERC-721令牌的形式分发徽章,以证明您参与了一个活动。更多关于POAP的信息。
// Example of icon use import Icon from "./Icon" // Within JSX: <Icon name="alias" />
声明您的POAP!什么是POAP?
- Gatsby + GraphQL used for loading of images and preferred for API calls (in lieu of REST, if possible/practical). Utilizes static page queries that run at build time, not at run time, optimizing performance
- Image loading example:
import { graphql } from "gatsby" export const query = graphql` query { hero: file(relativePath: { eq: "developers-eth-blocks.png" }) { childImageSharp { fluid(maxWidth: 800) { ...GatsbyImageSharpFluid } } } } ` // These query results get passed as an object `props.data` to your component
- API call example:
import { graphql } from "gatsby" export const repoInfo = graphql` fragment repoInfo on GitHub_Repository { stargazerCount languages(orderBy: { field: SIZE, direction: DESC }, first: 2) { nodes { name } } url } ` export const query = graphql` query { hardhatGitHub: github { repository(owner: "nomiclabs", name: "hardhat") { ...repoInfo } } } ` // These query results get passed as an object `props.data` to your component
如果您在2020年提交了任何合并到我们回购中的变更,您将有一个POAP等待!
以太坊eth.org2020年投稿人POAP即将发布:2021个POAP投稿人加入我们的Discord服务器,创建一个新的问题(如果你想被分配到这个问题),这样我们的团队就可以将问题分配给你。

What is POAP?
这包括我们在Crowdin上的专用翻译人员
ethereum.org 2020 Contributor POAP
-
以太坊eth.org!”>
-
👆 要申请您的贡献者POAP,请加入我们的Discord服务器,并在POAP中粘贴指向您贡献的链接-🏆 频道
我们团队的一名成员将验证您的请求,并为您提供一个个人化的链接,以声明您自己的新铸造POAP收藏品!
-
感谢这些优秀的人(emoji键):
-
这个项目遵循所有贡献者规范。任何形式的贡献欢迎!我们有一个讨论所有事情的空间以太坊eth.org–分享你的想法或只是在不和谐的时候打个招呼。
Coming soon: 2021 POAPs
- Stay tuned for details!
Contributors
Thanks goes to these wonderful people (emoji key):
ExodusActual |
Anna Karpińska |
8bitp |
Rousos Alexandros |
EvanVanNessEth |
JesseAbram |
Lililashka |
vrde |
Richard McSorley |
Alejandro Santander |
Jason Carver |
Chaitanya Potti |
chriseth |
Craig Williams |
Damian Rusinek |
Danny Ryan |
Franco Zeoli |
Guy Lando |
James Connolly |
Jacob Burden |
joshorig |
mariapaulafn |
Martín |
Mattias Nystrom |
nabetse |
Nick Savers |
Nina Breznik |
Ven Gist |
Paul Fletcher-Hill |
Phil |
Rémi Prévost |
Shane |
Andrey Petrov |
Santiago Palladino |
Tim Beiko |
Wanseob Lim |
Wil Barnes |
Aniket |
Chris Chinchilla |
George Spasov |
Pierrick TURELIER |
Solexplorer |
Sunghee Lee |
awallendahl |
Boris Mann |
carumusan |
econoar |
Gustavo Esquinca |
Javier Tarazaga |
Kendall Cole |
Brendan Lee |
Mahesh Murthy |
Patrick Gallagher |
Ali Abbas |
wtf |
Aleksandr Sobolev |
Zak Cole |
Bogdan Habic |
Nick Sawinyh |
Miguel Angel Gordián |
Eswara Sai |
ethers |
Felipe Faraggi |
Maurelian |
CPSTL |
Hudson Jameson |
Shayan Eskandari |
Lukas Sägesser |
Virgil Griffith |
Eugene Aseev |
Jannis Pohlmann |
think-in-universe |
Josh Stark |
Alan Woo |
Manank Patni |
Rogério Araújo |
Natacha Souza |
sorumfactory |
Sam Richards |
Antonio Della Porta |
Abhimanyu Shekhawat |
William Entriken |
Sangphil Kim |
peijie |
Jokyash |
Pedro Rivera |
Gabriele Rigo |
Tilen Držan |
jJosko1986 |
ECN |
Damiano Azzolini |
matteopey |
Hun Ryu |
nake13 |
alexiskefalas |
Behrad Khodayar |
Frankaus |
hacktar |
Jaroslav Macej |
Eman Herawy |
Bellinas |
Alexander Cherkashin |
Enoch Mbaebie |
inlak16 |
Bob Jiang |
Suhun Kim |
Jean Zundel |
Hachemi |
hanzoh |
Vincent Le Gallic |
Enigmatic331 |
Ganesh Prasad Kumble |
Pandiyaraja Ramamoorthy |
Archan Roychoudhury |
SAI PRASHANTH VUPPALA |
Sayid Almahdy |
jeedani |
Akira |
karansinghgit |
Marc Garreau |
mul53 |
Apoorv Lathey |
Ken Sato |
Sesamestrong |
ChrisK |
Stefan van As |
Grégoire Jeanmart |
nysxah |
Rachel |
wschwab |
Edson Ayllon |
Peteris Erins |
jimmyshi |
Jefte Costa |
Jinho Jang |
Julien Klepatch |
Yaz Khoury |
Yos Riady |
Andrew Cohen |
Wesley van Heije |
gr0uch0dev |
sooyoung |
Adria Massanet |
Alex Singh |
Carl Fairclough |
Kaven C |
Markus Hatvan |
Evans Tucker |
Adina Cretu |
tvanepps |
Victor Guyard ️️️️ |
Abhranil Das |
Ahmet Emin Koçal |
Aqeel |
Linda Xie |
Ian Eck |
Chris Waring |
Ev |
Ivan Martinez |
Sebastian T F |
Anett Rolikova |
Pooja Ranjan |
sassal |
Robert Zaremba |
Tas |
Sylvain Pace |
Sina Habibian |
Dennison Bertram |
Artur Gontijo |
ethjoe |
cooganb |
drequinox |
Tarun Gupta |
Jamie Pitts |
Chris Seifert |
John Craig |
Noam Eppel |
Jacob Willemsma |
Alex |
Paul Razvan Berg |
ph5500 |
John Monarch |
Shadab Khan |
ryancreatescopy |
Hammad Jutt |
Becaz |
Caos |
codingsh |
Artem |
Cristian Espinoza Garner |
Daniel Schlabach |
Marius van der Wijden |
Markus Waas |
Keith Yeung |
Jordan Lyall |
elanh |
Mohamed Hayibor |
Conor Svensson |
Aranha |
Jung Sup (James) Yoo |
Veit Progl |
jcamilli |
Martin Holst Swende |
Steven Gilbert |
Sacha Saint-Leger |
Griffin Ichiba Hotchkiss |
Scott Bigelow |
Harikrishnan Mulackal |
Matthieu Caneill |
Arjuna Sky Kok |
Brian Gu |
Gonçalo Hora de Carvalho |
Mário Havel |
JosefJ |
Christoph Burgdorf |
slipperybeluga |
David Liu |
shreyashariharan3 |
Adrián Calvo |
daviroo |
Wim Notredame |
vasa |
Franziska Heintel |
Muhammad Umair Irshad |
Nazzareno Massari |
Mayemene Fomene Jean Vladimir |
Yahsin Huang |
James Zaki |
Greg Lang |
Matt Voska |
mustafa |
Paul Wackerow |
Attaphong Rattanaveerachanon |
LoinLiao |
DrMad92 |
Patricio Palladino |
David Murdoch |
MashhoodIjaz |
Dan Nolan |
Marek Kirejczyk |
Jon Cursi |
James Farrell |
Xavi Arias Seguí |
ANKIT_PAL |
İsmail Kerim Cem |
Joanne |
michael60634 |
Andrei Maiboroda |
Anki |
Michelle Plur |
PAAlmasi |
Ben Edgington |
alexsantee |
peth-yursick |
Alwin Stockinger |
Roberto Henríquez Perozo |
strykerin |
jddxf |
LucasRoorda |
Mihir Luthra |
tentodev |
MiZiet |
Vaibhav Chopra |
Lakshman Sankar |
hewigovens |
DragonDev1906 |
Ryan Ghods |
Oliver |
Kristiyan |
Matthieu Riou |
pansay |
eirtscience |
Francis Lewis |
baub |
lamone |
Sean O’Connor |
Tara Rowell |
Aleksi Cohen |
Kartikaya Gupta (kats) |
siddhantkharode |
Renan Dincer |
Zhangyuan Nie |
Patrick Collins |
Sant Deleon |
Martin Huschenbett |
Kalle Moen |
Vitaly |
Nikolay Yushkevich |
darkwater4213 |
Akash Nimare |
Dave Mackey |
Emanuel Tesař |
DeFiDude |
Austin Griffith |
Chase Manning |
Colin Steil |
MonarthS |
Adam Dry |
Nikolai Vavilov |
Katie |
comeToThinkOfEth |
catsnackattack |
Maurycy |
Igor Papandinas |
Tahir Alvi |
amirmehdi |
Dan Dadybaev |
Finley |
nobd |
Alexander Sadovskyi |
Ethan Sarif-Kattan |
C.J. Kozarski |
Yakko Majuri |
John Adler |
Just some guy |
Vedvardhan |
Yussuf Elarif |
David Awad |
Alex Beregszaszi |
Adam Goth |
Anurag Pal |
Vishal Pratap Singh |
qbzzt |
Ewa Kowalska |
Aheesh |
tophersjones |
Andrew Yang |
$hoot->Pairs |
NilsKaden |
Stuart Reynolds |
Gwenael Le Bodic |
Anurag Verma |
Nikolai Golub |
Elliot Lee |
Viktor Garske |
Kristjan Grm |
Mac L |
Bruce MacDonald |
Ronnie Sherfey |
Ali Rahman |
Erik Vandeputte |
TM Lee |
mic0des |
Hakeem Almidan |
Julien Rioux |
Justin Chow |
Gabi |
Rohit Gopal |
Jordan Overbye |
This project follows the all-contributors specification. Contributions of any kind welcome!
Join our Discord server
We have a space to discuss all things ethereum.org – share your ideas or just say hi over on Discord.
Merge pull request
部分转自网络,侵权联系删除区块链源码网
区块链知识分享网, 以太坊dapp资源网, 区块链教程, fabric教程下载, 区块链书籍下载, 区块链资料下载, 区块链视频教程下载, 区块链基础教程, 区块链入门教程, 区块链资源 » 基于区块链的毕业设计👋 Welcome to ethereum.org! – 👋 欢迎来到以太坊.org!