gradle构建编码
Have you ever wanted to build something but you had no idea what to do? Just as authors sometimes have “writer's block” it’s also true for developers.
您是否曾经想过建造一些东西,但又不知道该怎么做? 正如作者有时会遇到“作家障碍”一样,对于开发人员来说也是如此。
Together with my friend Jim we created a collection of application ideas which is intended to solve this issue once and for all!
我们与我的朋友Jim共同创建了一系列应用程序创意 ,旨在彻底解决此问题!
These applications are:
这些应用程序是:
- great to improve your coding skills 非常适合提高您的编码技能
- great to experiment with new technologies 伟大的尝试新技术
- great to be added in your portfolio to impress your next employer/client 非常适合添加到您的投资组合中,以打动您的下一个雇主/客户
- great to be used as examples in tutorials (articles or videos) 非常适合用作教程(文章或视频)中的示例
- easy to complete and also easily extendable with new features 易于完成,并且易于扩展,并具有新功能
This is not just a simple list of projects, but a collection that describes each project in enough detail so you can develop it from the ground up!
这不仅是一个简单的项目列表,而且是一个足够详细地描述每个项目的集合,因此您可以从头开始进行开发!
Each project specification contains the following:
每个项目规范都包含以下内容:
- A clear and descriptive objective 明确的描述性目标
A list of User Stories which should be implemented (these stories act more as a guideline than a forced list of To-Do’s. Feel free to add your own features if you want)
应当实施的用户故事列表(这些故事充当指南,而不是强制性的待办事项列表。请根据需要随意添加自己的功能)
A list of bonus features that improve not only the base project but also your skills at the same time
一系列奖金功能 ,这些功能不仅可以改善基础项目,而且可以同时提高您的技能
- All the resources and links to help you find what you need to complete the project 所有资源和链接可帮助您找到完成项目所需的内容
专案 (Projects)
All of the projects are divided into three tiers based on the knowledge and experience required to complete them. These tiers are:
根据完成项目所需的知识和经验,所有项目都分为三个层次。 这些层是:
Beginner — Developers in the early stages of their learning journey. Those who are typically focused on creating user-facing applications.
初学者 -处于学习旅程初期的开发人员。 那些通常专注于创建面向用户的应用程序的人。
Intermediate — Developers at an intermediate stage of learning and experience. They are comfortable in UI/UX, using development tools, and building apps that use API services.
中级 —开发人员处于学习和经验的中间阶段。 他们对使用开发工具和使用API服务的应用程序的UI / UX感到很满意。
Advanced — Developers who have all of the above, and are learning more advanced techniques like implementing BackEnd applications and Database services.
高级 —具有以上所有内容的人员,并且正在学习更高级的技术,例如实现BackEnd应用程序和数据库服务。
Below you’ll find 5 projects for each of the tiers (15 in total), but there are over 30 projects (at the moment) in this GitHub repository. Make sure you check it out as we are planning to add more projects in the future. You are welcome to help! (More about this in the Contributing section below ?)
在下面,您将为每个层找到5个项目 ( 总共15个 ),但是此GitHub存储库中目前有30多个项目 (目前)。 确保您将其签出,因为我们计划在将来添加更多项目。 欢迎您的帮助! (有关更多信息,请参见下面的“ 贡献”部分?)
1.笔记应用 (1. Notes App)
Tier: 1 — Beginner
等级: 1 —初学者
Description: Create and store your notes for a later purpose!
描述 :创建并存储您的笔记以备后用!
用户故事 (User Stories)
- User can create a note 用户可以创建笔记
- User can edit a note 用户可以编辑笔记
- User can delete a note 用户可以删除笔记
- When closing the browser window the notes will be stored and when the User returns, the data will be retrieved 当关闭浏览器窗口时,便笺将被存储,当用户返回时,将检索数据
奖励功能 (Bonus features)
- User can create and edit a note in Markdown format. On save it will convert Markdown to HTML 用户可以以Markdown格式创建和编辑便笺。 保存后,会将Markdown转换为HTML
- User can see the date when he created the note 用户创建便笺时可以看到日期
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
2.圣诞灯 (2. Christmas Lights)
Tier: 1 — Beginner
等级: 1 —初学者
Description: The Christmas Lights application relies on your development talents to create a mesmerizing light display. Your task is to draw seven colored circles in a row and based on a timer change the intensity of each circle. When a circle is brightened its predecessor returns to its normal intensity.
描述 :Christmas Lights应用程序依靠您的开发才能来创建令人着迷的灯光显示屏。 您的任务是连续绘制七个彩色圆圈,并根据计时器更改每个圆圈的强度。 当圆圈变亮时,其前身恢复到其正常强度。
This simulates the effect of a string of rippling lights, similar to the ones displayed during the Christmas Holidays.
这模拟了一连串的涟漪灯的效果,类似于圣诞节假期期间显示的效果。
用户故事 (User Stories)
- User can press a button to start and stop the display 用户可以按一个按钮来启动和停止显示
- User can change the interval of time controlling the change in intensity 用户可以改变时间间隔来控制强度的变化
奖励功能 (Bonus features)
- User can select the color used to fill each circle 用户可以选择用于填充每个圆圈的颜色
- User can specify the intensity value 用户可以指定强度值
- User can change the size of any circle in the row 用户可以更改行中任何圆圈的大小
- User can specify the number of rows to be included in the display. From one to seven rows can be chosen 用户可以指定要包括在显示中的行数。 可以选择1到7行
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
3. FlipImage (3. FlipImage)
Tier: 1 — Beginner
等级: 1 —初学者
Description: It’s important for Web Developers to understand the basics of manipulating images since rich web applications rely on images to add value to the user interface and user experience (UI/UX).
描述 :对于Web开发人员来说,理解图像的基础很重要,因为富Web应用程序依赖图像来为用户界面和用户体验(UI / UX)增值。
FlipImage explores one aspect of image manipulation — image rotation. This app displays a square panel containing a single image presented in a 2x2 matrix. Using a set of up, down, left, and right arrows adjacent to each of the images the user may flip them vertically or horizontally.
FlipImage探索图像处理的一个方面-图像旋转。 该应用程序显示一个正方形面板,其中包含以2x2矩阵呈现的单个图像。 使用与每个图像相邻的一组向上,向下,向左和向右箭头,用户可以垂直或水平翻转它们。
You must only use native HTML, CSS, and Javascript to implement this app. Image packages and libraries are not allowed.
您只能使用本机HTML,CSS和Javascript来实现此应用程序。 不允许使用图像包和库。
用户故事 (User Stories)
- User can see a pane containing a single image repeated in a 2x2 matrix 用户可以看到一个窗格,其中包含以2x2矩阵重复的单个图像
- User can flip any one of the images vertically or horizontally using a set of up, down, left, and right arrows next to the image 用户可以使用图像旁边的一组向上,向下,向左和向右箭头垂直或水平翻转任何一个图像
奖励功能 (Bonus features)
- User can change the default image by entering the URL of a different image in an input field 用户可以通过在输入字段中输入其他图像的URL来更改默认图像
- User can display the new image by clicking a ‘Display’ button next to the input field 用户可以通过单击输入字段旁边的“显示”按钮来显示新图像
- User can see an error message if the new images URL is not found 如果未找到新图像URL,用户会看到一条错误消息
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
4.测验应用 (4. Quiz App)
Tier: 1 — Beginner
等级: 1 —初学者
Description: Practice and test your knowledge by answering questions in a quiz application.
描述 :通过在测验应用程序中回答问题来练习和测试您的知识。
As a developer, you can create a quiz application for testing coding skills of other developers. (HTML, CSS, JavaScript, Python, PHP, etc…)
作为开发人员,您可以创建测验应用程序以测试其他开发人员的编码技能。 (HTML,CSS,JavaScript,Python,PHP等)
用户故事 (User Stories)
User can start the quiz by pressing a
button
用户可以通过按一个
button
来开始测验- User can see a question with 4 possible answers 用户可以看到带有4个可能答案的问题
- After selecting an answer, display the next question to the User. Do this until the quiz is finished 选择答案后,向用户显示下一个问题。 这样做直到测验结束
- In the end, the User can see the following statistics: 最后,用户可以看到以下统计信息:
- Time it took to finish the quiz 完成测验所需的时间
- How many correct answers did he get 他得到了多少正确答案
A message showing if he
passed
orfailed
the quiz消息显示,如果他
passed
或failed
的测验
奖励功能 (Bonus features)
- User can share the result of a quiz on social media 用户可以在社交媒体上分享测验结果
- Add multiple quizzes to the application. User can select which one to take 将多个测验添加到应用程序。 用户可以选择哪一个
- User can create an account and have all the scores saved in his dashboard. User can complete a quiz multiple times 用户可以创建一个帐户,并将所有分数保存在其仪表板中。 用户可以多次完成测验
有用的链接和资源 (Useful links and resources)
示例项目 (Example projects)
Quiz app built with React (wait for it to load as it is hosted on Heroku)
使用React构建的测验应用程序 (等待它在Heroku上托管时加载)
5.罗马数字到十进制数字转换器 (5. Roman Numeral to Decimal numbers Converter)
Tier: 1 — Beginner
等级: 1 —初学者
Description: The numeric system represented by Roman numerals originated in ancient Rome and remained the usual way of writing numbers throughout Europe well into the Late Middle Ages. Roman numerals, as used today, employ seven symbols, each with a fixed integer value.
描述 :以罗马数字表示的数字系统起源于古罗马,一直是整个欧洲一直写入中世纪晚期的常用数字写方法。 今天使用的罗马数字使用七个符号,每个符号具有固定的整数值。
See the below table the Symbol — Value pairs:
请参见下表“ 符号—值对”:
- I — 1 我-1
- V — 5 V — 5
- X — 10 X-10
- L — 50 L — 50
- C — 100 C – 100
- D — 500 D — 500
- M — 1000 M — 1000
用户故事 (User Stories)
- User should be able to enter one Roman number in an input field 用户应该能够在输入字段中输入一个罗马数字
- User could see the results in a single output field containing the decimal (base 10) equivalent of the roman number that was entered by pressing a button 用户可以在一个输出字段中看到结果,该输出字段包含等效于通过按按钮输入的罗马数字的十进制(以10为基数)
- If a wrong symbol is entered, the User should see an error 如果输入了错误的符号,则用户应该看到一个错误
奖励功能 (Bonus features)
- User could see the conversion to be made automatically as I type 用户输入时可以看到转换是自动进行的
- User should be able to convert from decimal to Roman (vice-versa) 用户应该能够从十进制转换为罗马(反之亦然)
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
6.图书查找器应用 (6. Book Finder App)
Tier: 2 — Intermediate
等级: 2-中级
Description: Create an application that will allow users to search for books by entering a query (Title, Author, etc). Display the resulting books in a list on the page with all the corresponding data.
描述 :创建一个应用程序,允许用户通过输入查询(标题,作者等)来搜索书籍。 在页面上的列表中显示包含所有相应数据的结果书籍。
用户故事 (User Stories)
User can enter a search query into an
input
field用户可以在
input
字段中输入搜索查询User can submit the query. This will call an API that will return an array of books with the corresponding data (Title, Author, Published Date, Picture, etc)
用户可以提交查询。 这将调用一个API,该API将返回带有相应数据( 书名 , 作者 , 出版日期 , 图片等)的书籍数组。
- User can see the list of books appearing on the page 用户可以看到页面上显示的书籍列表
奖励功能 (Bonus features)
- For each item in the list add a link that will send the User to an external site which has more information about the book 为列表中的每个项目添加一个链接,该链接会将用户发送到具有有关该书的更多信息的外部站点
- Implement a Responsive Design 实施响应式设计
- Add loading animations 添加加载动画
有用的链接和资源 (Useful links and resources)
You can use the Google Books API
您可以使用Google Books API
示例项目 (Example Project)
7.卡记忆游戏 (7. Card-Memory-Game)
Tier: 2 — Intermediate
等级: 2-中级
Description: Card memory is a game where you have to click on a card to see what image is underneath it and try to find the matching image underneath the other cards.
描述/控制 :卡记忆是一种游戏,您必须单击一张卡以查看其下方的图像,然后尝试查找其他卡下方的匹配图像。
用户故事 (User Stories)
User can see a grid with n x n cards (
n
is an integer). All the cards are faced down initially (hidden
state)用户可以看到带有nxn张卡片的网格(
n
是整数)。 最初所有卡面朝下(hidden
状态)- User can click a button to start the game. When this button is clicked, a timer will start 用户可以单击一个按钮来启动游戏。 单击此按钮后,计时器将启动
User can click on any card to unveil the image that is underneath it (change it to
visible
state). The image will be displayed until the user clicks on a 2nd card用户可以单击任何卡以显示其下方的图像(将其更改为
visible
状态)。 图像将一直显示,直到用户单击第二张卡
When the User clicks on the 2nd card:
当用户单击第二张卡时:
If there is a match, the 2 cards will be eliminated from the game (either hide/remove them or leave them in the
visible
state)如果有比赛,则将两张牌从游戏中删除(隐藏/删除它们或将它们保留在
visible
状态)If there isn’t a match, the 2 cards will flip back to their original state (
hidden
state)如果没有匹配项,则两张卡将翻转回其原始状态(
hidden
状态)- When all the matches have been found, the User can see a dialog box showing a Congratulations message with a counter displaying the time it took to finish the game 找到所有匹配项后,用户可以看到一个对话框,显示一个祝贺消息,并带有一个计数器,该计数器显示完成游戏所花费的时间
奖励功能 (Bonus features)
- Use can choose between multiple levels of difficulty (Easy, Medium, Hard). Increased difficulty means: decreasing the time available to complete and/or increasing the number of cards 使用可以在多个难度级别(轻松,中等,困难)之间进行选择。 难度增加意味着:减少完成卡片的时间和/或增加卡数
- User can see the game statistics (nr. of times he won / he lost, the best time for each level) 用户可以查看游戏统计信息(获胜/失败的次数,每个级别的最佳时间)
有用的链接和资源 (Useful links and resources)
示例项目 (Example projects)
8.降价表生成器 (8. Markdown Table Generator)
Tier: 2 — Intermediate
等级: 2-中级
Description: Create an application that will convert a regular table with data provided by the User (optionally) into a Markdown formatted table.
描述 :创建一个应用程序,它将带有用户(可选)提供的数据的常规表转换为Markdown格式的表。
用户故事 (User Stories)
User can create an
HTML table
with a given number of Rows and Columns用户可以创建具有给定行数和列数的
HTML table
User can insert text in each cell of the
HTML table
用户可以在
HTML table
每个单元格中插入文本User can generate a
Markdown formatted table
that will contain the data from theHTML table
用户可以生成
Markdown formatted table
,该Markdown formatted table
将包含HTML table
的数据User can preview the
Markdown formatted table
用户可以预览
Markdown formatted table
奖励功能 (Bonus features)
User can copy the
Markdown formatted table
to the clipboard by pressing a button用户可以通过按按钮将
Markdown formatted table
复制到剪贴板User can insert a new Row or Column to a specified location
用户可以在指定位置插入新的行或列
User can delete a Row or a Column entirely
用户可以完全删除行或列
User can align (to the left, right or center) a cell, a column, a row, or the entire table
用户可以将单元格 , 列 , 行或整个表格 ( 向左 , 向右或居中 )对齐
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
Tables Generator / Markdown Tables
9.弦乐艺术 (9. String Art)
Tier: 2 — Intermediate
等级: 2-中级
Description: The purpose of String Art is to provide the developer with practice creating a simple animated graphic, using geometry in the animation algorithm, and creating something that’s visually pleasant to watch.
Description(说明) :String Art的目的是为开发人员提供练习,以创建简单的动画图形,在动画算法中使用几何图形以及创建视觉上令人愉悦的东西。
String Art draws a single multicolored line which smoothly moves until one end touches a side of the enclosing window. At the point, it touches a “bounce” effect is applied to change its direction.
弦乐艺术画了一条多色的线,该线平滑地移动,直到一端碰到封闭窗口的一侧。 此时,它会碰触“反弹”效果,以更改其方向。
A ripple effect is created by only retaining 10–20 images of the line as it moves. Older images are progressively faded until they disappear.
通过仅在移动时保留线条的10–20个图像来创建波纹效果。 较旧的图像逐渐消失,直到消失。
Animation libraries are not allowed. Use only Vanilla HTML/CSS/JavaScript.
不允许使用动画库。 仅使用Vanilla HTML / CSS / JavaScript。
用户故事 (User Stories)
- Start by drawing a multicolored line at a random position within the boundary of it’s enclosing window 首先在封闭窗口边界内的任意位置绘制多色线
- Each 20 ms draw a new copy of the line at a new position based on a trajectory — the incremental distance from the previous line based on the endpoints 每20毫秒根据轨迹在新位置绘制一条线的新副本-根据端点到上一条线的增量距离
- When either endpoint of the line touches the boundary of the enclosing window change it’s direction and randomly alter its angle 当线条的任一端点接触封闭窗口的边界时,更改其方向并随机更改其角度
- Progressively fade the intensity of old lines so that only the most recent 10–20 lines are visible to create the sense of movement or “ripple” 逐渐淡化旧线条的强度,以便仅显示最近的10–20条线条,以产生移动感或“涟漪”感
奖励功能 (Bonus features)
- User can specify the length of the line and its velocity 用户可以指定线的长度及其速度
- User can specify the multiple lines within the window, all moving along different trajectories and velocities 用户可以在窗口中指定多条线,所有线均沿不同的轨迹和速度移动
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
This project is very close, but has a small enclosing window and is monochromatic. Daniel Cortes
这个项目非常接近,但是有一个小的封闭窗口并且是单色的。 丹尼尔·科尔特斯
10.待办事项 (10. To-Do App)
Tier: 2 — Intermediate
等级: 2-中级
Description: The classic To-Do application where a user can write down all the things he wants to accomplish.
描述 :经典的“待办事项”应用程序,用户可以在其中写下自己想要完成的所有事情。
用户故事 (User Stories)
User can see an
input
field where he can type in a to-do item用户可以看到一个
input
字段,可以在其中input
待办事项- By pressing enter (or a button), the User can submit the to-do item and can see that being added to a list of to-do’s 通过按Enter键(或按钮),用户可以提交待办事项,并可以看到将其添加到待办事项列表中
User can mark a to-do as
completed
用户可以将待办事项标记为
completed
- User can remove a to-do item by pressing on a button (or on the to-do item itself) 用户可以通过按一个按钮(或待办事项本身)来删除待办事项。
奖励功能 (Bonus features)
- User can edit a to-do 用户可以编辑待办事项
- User can see a list with all the completed to-do’s 用户可以看到包含所有已完成待办事项的列表
- User can see a list with all the active to-do’s 用户可以看到包含所有活动待办事项的列表
- User can see the date when he created the to-do 用户可以在创建待办事项时看到日期
- When closing the browser window the to-do’s will be stored and when the User returns, the data will be retrieved 关闭浏览器窗口时,待办事项将被存储,当用户返回时,将检索数据
有用的链接和资源 (Useful links and resources)
示例项目 (Example projects)
11.战舰游戏引擎 (11. Battleship Game Engine)
Tier: 3 — Advanced
等级: 3-高级
Description: Battleship Game Engine (BGE) implements the classic turn-based board game as a package that’s separated from any presentation layer. This is a type of architectural pattern that useful in many application since it allows any number of apps to utilize the same service.
描述 :战舰游戏引擎(BGE)将经典的回合制棋盘游戏实现为与任何表示层分离的软件包。 这是一种架构模式,在许多应用程序中都很有用,因为它允许任意数量的应用程序使用相同的服务。
The BGE itself is invoked through a series of function calls rather than through directly coupled end-user actions. In this respect using the BGE is similar to using an API or a series of routes exposed by a web server.
BGE本身是通过一系列函数调用而不是通过直接耦合的最终用户操作来调用的。 在这方面,使用BGE类似于使用API或Web服务器公开的一系列路由。
This challenge requires that you develop the BGE and a very thin, text-based presentation layer for testing that’s separate from the engine itself. Due to this, the User Stories below are divided two sets — one for the BGE and one for the text-based presentation layer.
这项挑战要求您开发BGE和一个非常薄的,基于文本的表示层以进行测试,并且与引擎本身是分开的。 因此,下面的用户故事分为两组-一组用于BGE,另一组用于基于文本的表示层。
BGE is responsible for maintaining the game state.
BGE负责维护游戏状态。
用户故事 (User Stories)
BGE (BGE)
Caller can invoke a
startGame()
function to begin a 1-player game. This function will generate an 8x8 game board consisting of 3 ships having a width of one square and a length of:调用者可以调用
startGame()
函数来开始1人游戏。 此功能将生成一个8x8游戏板,该游戏板由3艘船组成,其宽度为一个正方形,长度为:
- Destroyer: 2 squares 驱逐舰:2个正方形
- Cruiser: 3 squares 巡洋舰:3平方
- Battleship: 4 squares 战舰:4平方
startGame()
will randomly place these ships on the board in any direction and will return an array representing ship placement.
startGame()
会将这些飞船随机放置在任意方向上,并将返回一个表示飞船放置的数组。
Caller can invoke a
shoot()
function passing the target row and column coordinates of the targeted cell on the game board.shoot()
will return indicators representing if the shot resulted in a hit or miss, the number of ships left (i.e. not yet sunk), the ship placement array, and updated hits and misses array.调用者可以调用
shoot()
函数,以传递游戏板上目标单元格的目标行和列坐标。shoot()
将返回指示击球是否造成命中或未命中,剩余船只数量(即尚未沉没),船只布置阵列以及更新的命中和未命中阵列的指示符。
Cells in the hits and misses array will contain a space if they have yet to be targeted, O
if they were targeted but no part of a ship was at that location, or X
if the cell was occupied by part of a ship.
命中和未命中数组中的像元如果尚未被定位,则将包含一个空格;如果被针对但没有船的一部分位于该位置,则为O
如果该像元被船的一部分占据,则为X
基于文本的表示层 (Text-based Presentation Layer)
User can see the hits and misses array displayed as a 2-dimensional character representation of the game board returned by the
startGame()
function.用户可以看到由
startGame()
函数返回的游戏板的二维字符表示的击中和未击中数组。- User can be prompted to enter the coordinates of a target square on the game board. 可以提示用户在游戏板上输入目标方块的坐标。
- User can see an updated hits and misses array display after taking a shot. 拍摄后,用户可以看到更新的命中和未命中阵列显示。
- User can see a message after each shot indicating whether the shot resulted in a hit or miss. 用户可以在每次射击后看到一条消息,指示该射击是命中还是未命中。
- User can see a congratulations message after the shot that sinks the last remaining ship. 用户在击沉最后一艘剩余飞船后可以看到祝贺消息。
- User can be prompted to play again at the end of each game. Declining to play again stops the game. 在每个游戏结束时,都会提示用户再次玩。 拒绝再次玩将停止游戏。
奖励功能 (Bonus features)
BGE (BGE)
Caller can specify the number of rows and columns in the game board as a parameter to the
startGame()
function.调用者可以将游戏板上的行数和列数指定为
startGame()
函数的参数。Caller can invoke a
gameStats()
function that returns a Javascript object containing metrics for the current game. For example, the number of turns played, the current number of hits and misses, etc.调用者可以调用
gameStats()
函数,该函数返回一个Javascript对象,其中包含当前游戏的指标。 例如,玩的回合数,当前的命中和未击中的次数等。Caller can specify the number of players (1 or 2) when calling
startGame()
which will generate one board for each player randomly populated with ships.呼叫方可以在调用
startGame()
时指定玩家人数(1或2),这将为每个随机装有飞船的玩家生成一个棋盘。
shoot()
will accept the player number the shot is being made for along with the coordinates of the shot. The data it returns will be for that player.
shoot()
会接受shoot()
的球员编号以及拍摄的坐标。 它返回的数据将用于该玩家。
基于文本的表示层 (Text-based Presentation Layer)
User can see the current game statics at any point by entering the phrase
stats
in place of target coordinates. (Note that this requires thegameStats()
function in the BGE)通过输入短语
stats
代替目标坐标,用户可以随时查看当前的游戏静态stats
。 (请注意,这需要BGE中的gameStats()
函数)- User can specify a two-player game is to be played, with each player alternating turns in the same terminal session (Note that this requires corresponding Bonus Features in the BGE) 用户可以指定要玩的两人游戏,每个玩家在同一终端会话中交替轮流(注意,这需要BGE中的相应奖励功能)
- User can see the player number in prompts associated with the inputs in each turn. 用户可以在每个回合的输入提示中看到玩家编号。
- User can see both players board at the end of each turn. 用户可以在每个回合结束时看到两个玩家的棋盘。
有用的链接和资源 (Useful links and resources)
示例项目 (Example projects)
This YouTube video shows how a text-based Battleship Game is played.
该YouTube视频显示了如何播放基于文本的战舰游戏 。
The following example is provided as a demonstration of the Battleship game if it is unfamiliar to you. Remember you are to implement a text-based presentation layer for testing. Battleship Game by Chris Brody
以下示例是您不熟悉的《战舰》游戏的演示。 请记住,您将实现一个基于文本的表示层进行测试。 克里斯·布罗迪(Chris Brody)的《战舰游戏》
12.聊天应用 (12. Chat App)
Tier: 3 — Advanced
等级: 3-高级
Description: Real-time chat interface where multiple users can interact with each other by sending messages.
描述 :实时聊天界面,多个用户可以通过发送消息彼此交互。
As an MVP(Minimum Viable Product) you can focus on building the Chat interface. Real-time functionality can be added later (the bonus features).
作为MVP(最低可行产品),您可以专注于构建聊天界面。 稍后可以添加实时功能(附加功能)。
用户故事 (User Stories)
- User is prompted to enter a username when he visits the chat app. The username will be stored in the application 当用户访问聊天应用时,系统会提示用户输入用户名。 用户名将存储在应用程序中
User can see an
input field
where he can type a new message用户可以看到一个
input field
,可以在其中input field
新消息By pressing the
enter
key or by clicking on thesend
button the text will be displayed in thechat box
alongside his username (e.g.John Doe: Hello World!
)通过按
enter
键或单击“send
按钮,文本将在chat box
显示在其用户名旁边(例如John Doe: Hello World!
)。
奖励功能 (Bonus features)
- The messages will be visible to all the Users that are in the chat app (using WebSockets) 该消息对聊天应用程序中的所有用户都是可见的(使用WebSockets)
- When a new User joins the chat, a message is displayed to all the existing Users 新用户加入聊天时,会向所有现有用户显示一条消息
- Messages are saved in a database 邮件保存在数据库中
- User can send images, videos, and links which will be displayed properly 用户可以发送将正确显示的图像,视频和链接
- User can select and send an emoji 用户可以选择并发送表情符号
- Users can chat in private 用户可以私下聊天
Users can join
channels
on specific topics用户可以加入有关特定主题的
channels
有用的链接和资源 (Useful links and resources)
示例项目 (Example project)
13. GitHub时间轴 (13. GitHub Timeline)
Tier: 3 — Advanced
等级: 3-高级
Description: API’s and graphical representation of information are hallmarks of modern web applications. GitHub Timeline combines the two to create a visual history of a users GitHub activity.
描述 :API和信息的图形表示是现代Web应用程序的标志。 GitHub时间轴将两者结合起来,以创建用户GitHub活动的可视历史记录。
The goal of GitHub Timeline is to accept a GitHub user name and produce a timeline containing each repo and annotated with the repo names, the date they were created, and their descriptions. The timeline should be one that could be shared with a prospective employer. It should be easy to read and make effective use of color and typography.
GitHub时间轴的目标是接受GitHub用户名,并生成一个包含每个存储库的时间轴,并用存储库名称,创建日期和描述进行注释。 该时间表应该是可以与潜在雇主共享的时间表。 它应该易于阅读并有效使用颜色和版式。
Only public GitHub repos should be displayed.
仅显示公共GitHub存储库。
用户故事 (User Stories)
- User can enter a GitHub user name 用户可以输入GitHub用户名
- User can click a ‘Generate’ button to create and display the named user's repo timeline 用户可以单击“生成”按钮来创建并显示指定用户的回购时间线
- User can see a warning message if the GitHub user name is not a valid GitHub user name. 如果GitHub用户名不是有效的GitHub用户名,则用户可以看到警告消息。
奖励功能 (Bonus features)
- User can see a summary of the number of repos tallied by the year they were created 用户可以查看按创建年份计算的回购数量的摘要
有用的链接和资源 (Useful links and resources)
GitHub offers two API’s you may use to access repo data. You may also choose to use an NPM package to access the GitHub API.
GitHub提供了两个API,您可以使用它们访问回购数据。 您也可以选择使用NPM软件包来访问GitHub API。
Documentation for the GitHub API can be found at:
可以在以下位置找到GitHub API的文档:
Sample code showing how to use the GitHub API’s are:
显示如何使用GitHub API的示例代码为:
You can use this CURL command to see the JSON returned by the V3 REST API for your repos:
您可以使用以下CURL命令查看V3 REST API为您的存储库返回的JSON:
curl -u "user-id" https://api.github.com/users/user-id/repos
示例项目 (Example projects)
14.拼写 (14. Spell-It)
Tier: 3 — Advanced
等级: 3-高级
Description: Knowing how to spell is a fundamental part of being fluent in any language. Whether you are a youngster learning how to spell or an individual learning a new language being able to practice helps to solidify your language skills.
描述 :知道如何拼写是流利使用任何语言的基础。 无论您是学习拼写的年轻人,还是个人学习能够练习的新语言,都可以帮助您巩固语言能力。
The Spell-It app helps users practice their spelling by playing the audio recording of a word the user must then spell using the computer keyboard.
Spell-It应用程序通过播放用户必须使用计算机键盘进行拼写的单词的录音来帮助用户练习拼写。
用户故事 (User Stories)
- User can click the ‘Play’ button to hear the word that’s to be entered 用户可以单击“播放”按钮来听到要输入的单词
- User can see letters displayed in the word input text box as they are entered on the keyboard 用户可以看到在键盘上输入的单词显示在单词输入文本框中
- User can click the ‘Enter’ button to submit the word that has been typed in the word input text box 用户可以单击“ Enter”按钮提交在单词输入文本框中输入的单词
- User can see a confirmation message when the correct word is typed 键入正确的单词时,用户可以看到一条确认消息
- User can see a message requesting the word be typed again when it is spelled incorrectly 当拼写不正确时,用户可以看到一条消息,要求再次输入该单词
- User can see a tally of the number of correct spellings, the total number of words attempted, and a percentage of successful entries. 用户可以看到正确拼写的数量,尝试输入的单词总数以及成功输入的百分比。
奖励功能 (Bonus features)
- User can hear a confirmation sound when the word is correctly spelled 正确拼写单词时,用户可以听到确认声音
- User can hear a warning sound when the word is incorrectly spelled 拼写错误时,用户会听到警告声
- User can click the ‘Hint’ button to highlight the incorrect letters in the word input text box 用户可以单击“提示”按钮以在单词输入文本框中突出显示不正确的字母
- User can press the ‘Enter’ key on the keyboard to submit a typed word or click the ‘Enter’ button in the app window 用户可以按键盘上的“ Enter”键提交输入的单词,或在应用程序窗口中单击“ Enter”按钮
有用的链接和资源 (Useful links and resources)
示例项目 (Example projects)
15.调查应用 (15. Survey App)
Tier: 3 — Advanced
等级: 3-高级
Description: Surveys are a valuable part of any developers toolbox. They are useful for getting feedback from your users on a variety of topics including application satisfaction, requirements, upcoming needs, issues, priorities, and just plain aggravations to name a few.
描述 :调查是任何开发人员工具箱的重要组成部分。 它们对于从用户那里获得有关各种主题的反馈非常有用,这些主题包括应用程序满意度,需求,即将到来的需求,问题,优先级,仅举一反。
The Survey app gives you the opportunity to learn by developing a full-featured app that will you can add to your toolbox. It provides the ability to define a survey, allow users to respond within a predefined timeframe, and tabulate and present results.
Survey应用程序使您有机会通过开发功能齐全的应用程序进行学习,并将其添加到工具箱中。 它提供了定义调查,允许用户在预定义的时间范围内做出响应以及将结果制成表格并进行呈现的功能。
Users of this app are divided into two distinct roles, each having different requirements:
此应用程序的用户分为两个不同的角色,每个角色都有不同的要求:
Survey Coordinators define and conduct surveys. This is an administrative function not available to normal users.
调查协调员定义并进行调查。 这是普通用户无法使用的管理功能。
Survey Respondents Complete surveys and view results. They have no administrative privileges within the app.
调查对象完成调查并查看结果。 他们在应用程序内没有管理权限。
Commercial survey tools include distribution functionality that mass emails surveys to Survey Respondents. For simplicity, this app assumes that surveys open for responses will be accessed from the app’s web page.
商业调查工具包括分发功能,该功能可将调查大量电子邮件发送给调查受访者。 为简单起见,此应用程序假定可以从该应用程序的网页访问为答复而打开的调查。
用户故事 (User Stories)
一般 (General)
- Survey Coordinators and Survey Respondents can define, conduct, and view surveys and survey results from a common website 调查协调员和调查响应者可以定义,执行和查看公共网站上的调查和调查结果
- Survey Coordinators can login to the app to access administrative functions, like defining a survey. 调查协调员可以登录该应用程序以访问管理功能,例如定义调查。
定义调查 (Defining a Survey)
- Survey Coordinator can define a survey containing 1–10 multiple choice questions. 调查协调员可以定义包含1–10个选择题的调查。
- Survey Coordinator can define 1–5 mutually exclusive selections to each question. 调查协调员可以为每个问题定义1-5个互斥选择。
- Survey Coordinator can enter a title for the survey. 调查协调员可以输入调查的标题。
- Survey Coordinator can click a ‘Cancel’ button to return to the home page without saving the survey. 调查协调员可以单击“取消”按钮以返回主页,而无需保存调查。
- Survey Coordinator can click a ‘Save’ button to save a survey. 调查协调员可以单击“保存”按钮以保存调查。
进行调查 (Conducting a Survey)
- Survey Coordinator can open a survey by selecting a survey from a list of previously defined surveys 调查协调员可以通过从先前定义的调查列表中选择一个调查来打开调查
- Survey Coordinators can close a survey by selecting it from a list of open surveys 调查协调员可以通过从打开的调查列表中选择调查来关闭调查
- Survey Respondent can complete a survey by selecting it from a list of open surveys 调查受访者可以通过从公开调查列表中选择调查来完成调查
- Survey Respondent can select responses to survey questions by clicking on a checkbox 调查受访者可以通过单击复选框来选择对调查问题的回答
- Survey Respondents can see that a previously selected response will automatically be unchecked if a different response is clicked. 调查受访者可以看到,如果单击其他响应,则先前选择的响应将自动取消选中。
- Survey Respondents can click a ‘Cancel’ button to return to the home page without submitting the survey. 调查受访者可以单击“取消”按钮以返回主页,而无需提交调查。
- Survey Respondents can click a ‘Submit’ button submit their responses to the survey. 调查对象可以单击“提交”按钮将其答复提交给调查。
- Survey Respondents can see an error message if ‘Submit’ is clicked, but not all questions have been responded to. 如果单击“提交”,但并非所有问题都已回答,调查受访者会看到错误消息。
查看调查结果 (Viewing Survey Results)
- Survey Coordinators and Survey Respondents can select the survey to display from a list of closed surveys 调查协调员和调查响应者可以从已关闭调查的列表中选择要显示的调查
- Survey Coordinators and Survey Respondents can view survey results as in tabular format showing the number of responses for each of the possible selections to the questions. 调查协调员和调查受访者可以表格形式查看调查结果,显示出每个可能选择的问题的答案数量。
奖励功能 (Bonus features)
- Survey Respondents can create a unique account in the app 调查对象可以在应用程序中创建一个唯一帐户
- Survey Respondents can login to the app 调查对象可以登录到应用程序
- Survey Respondents cannot complete the same survey more than once 调查受访者不能一次完成同一调查
- Survey Coordinators and Survey Respondents can view graphical representations of survey results (e.g. pie, bar, column, etc. charts) 调查协调员和调查受访者可以查看调查结果的图形表示(例如饼图,条形图,柱形图等)
有用的链接和资源 (Useful links and resources)
Libraries for building surveys: SurveyJS
建筑测量图书馆: SurveyJS
Some commercial survey services include: Survey Monkey and Typeform
一些商业调查服务包括: Survey Monkey和Typeform
示例项目 (Example project)
贡献 (Contributing)
You are welcome to contribute to the project in the GitHub repository! Any contribution is highly appreciated.
欢迎您在GitHub存储库中为该项目做出贡献! 非常感谢任何贡献。
You can contribute in two ways:
您可以通过两种方式做出贡献:
create an issue and tell us your idea. Make sure that you use the new idea label in this case;
提出问题并告诉我们您的想法。 在这种情况下,请确保使用新的想法标签。
- fork the project and submit a PR. Before doing that, please make sure that you read and follow the Contribution Guide (you can find it in the repository); 分叉项目并提交PR。 在此之前,请确保您已阅读并遵循《贡献指南》(可以在资源库中找到它);
添加您自己的示例 (Add your own examples)
You can also add your own examples to the projects after you have completed them. I highly encourage you to do this as it will show others what amazing things you have built! ?
完成示例后,您也可以将自己的示例添加到项目中。 我强烈建议您这样做,因为它可以向其他人展示您建造了哪些惊人的东西! ?
传播这个词! (Spread the word!)
If the information from this article and from the repo was useful to you in any way, make sure you give it a star ?, this way others can find it and benefit too! Together we can grow and make our community better!
如果本文和回购中的信息对您有任何帮助,请确保给它加一个星号,这样其他人也可以找到它并从中受益! 我们可以共同成长,并使我们的社区变得更好!
Do you have any suggestions on how we could improve this project overall? Let us know! We’d love to hear your feedback!
您对我们如何整体改善该项目有任何建议吗? 让我们知道! 我们希望听到您的反馈!
主要贡献者 (Main Contributors ??)
Florin Pop: Twitter and website.
Jim Medlock: Twitter and Medium
吉姆·梅德洛克(Jim Medlock) : Twitter和媒介
每周编码挑战? (Weekly Coding Challenge ?)
As a bonus, there’s a Weekly Coding Challenge where you can learn more by practicing your skills on real-world projects. Read The Complete Guide to find out how you can participate! ?
作为奖励,每周进行一次编程挑战,您可以通过在实际项目中练习技能来学习更多。 阅读完整指南 ,了解如何参加! ?
Originally published at www.florin-pop.com.
最初在www.florin-pop.com上发布。
gradle构建编码