LabyrinthLion
4 years ago
parent
af9de5f716
commit
28c87c512b
|
@ -1,38 +1,5 @@
|
|||||||
.App {
|
html,
|
||||||
text-align: center;
|
body,
|
||||||
}
|
#root {
|
||||||
|
height: 100%;
|
||||||
.App-logo {
|
|
||||||
height: 40vmin;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-reduced-motion: no-preference) {
|
|
||||||
.App-logo {
|
|
||||||
animation: App-logo-spin infinite 20s linear;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.App-header {
|
|
||||||
background-color: #282c34;
|
|
||||||
min-height: 100vh;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: calc(10px + 2vmin);
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.App-link {
|
|
||||||
color: #61dafb;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes App-logo-spin {
|
|
||||||
from {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,267 @@
|
|||||||
|
import {
|
||||||
|
Pane,
|
||||||
|
Paragraph,
|
||||||
|
UnorderedList,
|
||||||
|
ListItem,
|
||||||
|
OrderedList,
|
||||||
|
Link,
|
||||||
|
Table,
|
||||||
|
Image,
|
||||||
|
Heading,
|
||||||
|
} from 'evergreen-ui';
|
||||||
|
import coverimage from './app-ideas.png';
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Image width="100%" src={coverimage} alt="" />
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 1440 320"
|
||||||
|
height="3rem"
|
||||||
|
width="100%"
|
||||||
|
preserveAspectRatio="none"
|
||||||
|
style={{ transform: 'translateY(-0.3rem)' }}
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
fill="#FFDB14"
|
||||||
|
fill-opacity="1"
|
||||||
|
d="M0,256L60,240C120,224,240,192,360,154.7C480,117,600,75,720,53.3C840,32,960,32,1080,42.7C1200,53,1320,75,1380,85.3L1440,96L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z"
|
||||||
|
></path>
|
||||||
|
</svg>
|
||||||
|
<Pane margin="auto" width="90%">
|
||||||
|
<Paragraph>
|
||||||
|
Have you ever wanted to build something but you had no idea
|
||||||
|
what to do? Just as authors sometimes have "writers block"
|
||||||
|
it's also true for developers. This list is intended to
|
||||||
|
solve this issue once and for all! 👍
|
||||||
|
</Paragraph>
|
||||||
|
<Paragraph>These applications are:</Paragraph>
|
||||||
|
<UnorderedList>
|
||||||
|
<ListItem>
|
||||||
|
great for improving your coding skills 💪;
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
great for experimenting with new technologies 🆕;
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
great for adding to your portfolio to impress your next
|
||||||
|
employer/client 📁;
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
great for using as examples in tutorials (articles or
|
||||||
|
videos) 📃;
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
easy to complete and also easily extendable with new
|
||||||
|
features 👌;
|
||||||
|
</ListItem>
|
||||||
|
</UnorderedList>
|
||||||
|
<Paragraph>
|
||||||
|
This is not just a simple list of projects, but a collection
|
||||||
|
that describes each project in enough detail so that you can
|
||||||
|
develop it from the ground up!
|
||||||
|
</Paragraph>
|
||||||
|
<Paragraph>
|
||||||
|
Each project has the following <b>features:</b>
|
||||||
|
</Paragraph>
|
||||||
|
<OrderedList>
|
||||||
|
<ListItem>A clear and descriptive objective;</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
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 stories if
|
||||||
|
you want);
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
A list of bonus features that not only improve the base
|
||||||
|
project, but also your skills at the same time (these
|
||||||
|
are optional and should be attempted only after you have
|
||||||
|
completed the required user stories)
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
A list of bonus features that not only All the resources
|
||||||
|
and links to help you find what you need to complete the
|
||||||
|
project
|
||||||
|
</ListItem>
|
||||||
|
</OrderedList>
|
||||||
|
<Paragraph>
|
||||||
|
Here you can{' '}
|
||||||
|
<Link
|
||||||
|
href="https://www.youtube.com/watch?v=TNzCfgwIDCY"
|
||||||
|
rel="nofollow"
|
||||||
|
>
|
||||||
|
watch a video about this repository
|
||||||
|
</Link>
|
||||||
|
.
|
||||||
|
</Paragraph>
|
||||||
|
<hr />
|
||||||
|
<Heading>Projects</Heading>
|
||||||
|
<Paragraph>
|
||||||
|
Projects are divided into three tiers based on the knowledge
|
||||||
|
and experience required to complete them.
|
||||||
|
</Paragraph>
|
||||||
|
<Table width="89%" margin="auto" marginY="1rem">
|
||||||
|
<Table.Head>
|
||||||
|
<Table.TextHeaderCell
|
||||||
|
flexBasis="2rem"
|
||||||
|
flexShrink={0}
|
||||||
|
flexGrow={0}
|
||||||
|
>
|
||||||
|
Tier
|
||||||
|
</Table.TextHeaderCell>
|
||||||
|
<Table.TextHeaderCell>
|
||||||
|
Developer Profile
|
||||||
|
</Table.TextHeaderCell>
|
||||||
|
</Table.Head>
|
||||||
|
<Table.Body>
|
||||||
|
<Table.Row height="fit-content" padding="0.5rem">
|
||||||
|
<Table.Cell
|
||||||
|
flexBasis="2rem"
|
||||||
|
flexShrink={0}
|
||||||
|
flexGrow={0}
|
||||||
|
>
|
||||||
|
1
|
||||||
|
</Table.Cell>
|
||||||
|
<Table.Cell>
|
||||||
|
Developers in the early stages of their learning
|
||||||
|
journey. Those who are typically focused on
|
||||||
|
creating user-facing applications.
|
||||||
|
</Table.Cell>
|
||||||
|
</Table.Row>
|
||||||
|
<Table.Row height="fit-content" padding="0.5rem">
|
||||||
|
<Table.Cell
|
||||||
|
flexBasis="2rem"
|
||||||
|
flexShrink={0}
|
||||||
|
flexGrow={0}
|
||||||
|
>
|
||||||
|
2
|
||||||
|
</Table.Cell>
|
||||||
|
<Table.Cell>
|
||||||
|
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.
|
||||||
|
</Table.Cell>
|
||||||
|
</Table.Row>
|
||||||
|
<Table.Row height="fit-content" padding="0.5rem">
|
||||||
|
<Table.Cell
|
||||||
|
flexBasis="2rem"
|
||||||
|
flexShrink={0}
|
||||||
|
flexGrow={0}
|
||||||
|
>
|
||||||
|
3
|
||||||
|
</Table.Cell>
|
||||||
|
<Table.Cell>
|
||||||
|
Developers who have all of the above, and are
|
||||||
|
learning more advanced techniques like
|
||||||
|
implementing backend applications and database
|
||||||
|
services.
|
||||||
|
</Table.Cell>
|
||||||
|
</Table.Row>
|
||||||
|
</Table.Body>
|
||||||
|
</Table>
|
||||||
|
<hr />
|
||||||
|
<Heading>Plans for the future</Heading>
|
||||||
|
<Paragraph>
|
||||||
|
We are planning to add more and more projects to this
|
||||||
|
repository. For this, we need your help! Find out how to
|
||||||
|
contribute below. 👇
|
||||||
|
</Paragraph>
|
||||||
|
<Paragraph>
|
||||||
|
We are also planning to create a website where you can
|
||||||
|
easily browse through all of the projects.
|
||||||
|
</Paragraph>
|
||||||
|
<hr />
|
||||||
|
<Heading>Contribution</Heading>
|
||||||
|
<Paragraph>
|
||||||
|
Any contributions are highly appreciated. 🙏 You can
|
||||||
|
contribute in two ways:
|
||||||
|
</Paragraph>
|
||||||
|
<OrderedList>
|
||||||
|
<ListItem>
|
||||||
|
create an issue and tell us your idea 💡. Make sure that
|
||||||
|
you use the new idea label in this case;
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
fork the project and submit a PR with your new idea.
|
||||||
|
Before doing that, please make sure that you read and
|
||||||
|
follow the Contribution Guide;
|
||||||
|
</ListItem>
|
||||||
|
</OrderedList>
|
||||||
|
<Heading size={400}>Examples</Heading>
|
||||||
|
<Paragraph>
|
||||||
|
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 were built! 👍
|
||||||
|
</Paragraph>
|
||||||
|
<hr />
|
||||||
|
<Heading>Spread the word!</Heading>
|
||||||
|
<Paragraph>
|
||||||
|
If the information from this 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! 😃
|
||||||
|
</Paragraph>
|
||||||
|
<Paragraph>
|
||||||
|
Do you have any suggestions on how we could improve this
|
||||||
|
project overall? Let us know! We'd love to hear your
|
||||||
|
feedback!
|
||||||
|
</Paragraph>
|
||||||
|
<Heading size={400}>Main Contributors 🙂🙂</Heading>
|
||||||
|
<UnorderedList>
|
||||||
|
<ListItem>
|
||||||
|
<b>Florin Pop</b>:{' '}
|
||||||
|
<Link
|
||||||
|
href="https://twitter.com/florinpop1705"
|
||||||
|
rel="nofollow"
|
||||||
|
>
|
||||||
|
Twitter
|
||||||
|
</Link>{' '}
|
||||||
|
-{' '}
|
||||||
|
<Link
|
||||||
|
href="https://youtube.com/florinpop"
|
||||||
|
rel="nofollow"
|
||||||
|
>
|
||||||
|
YouTube Channel
|
||||||
|
</Link>{' '}
|
||||||
|
-{' '}
|
||||||
|
<Link href="https://florin-pop.com" rel="nofollow">
|
||||||
|
website
|
||||||
|
</Link>
|
||||||
|
.
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<b>Jim Medlock</b>:{' '}
|
||||||
|
<Link
|
||||||
|
href="https://twitter.com/jd_medlock"
|
||||||
|
rel="nofollow"
|
||||||
|
>
|
||||||
|
Twitter
|
||||||
|
</Link>{' '}
|
||||||
|
-{' '}
|
||||||
|
<Link
|
||||||
|
href="https://medium.com/@jdmedlock"
|
||||||
|
rel="nofollow"
|
||||||
|
>
|
||||||
|
articles
|
||||||
|
</Link>
|
||||||
|
</ListItem>
|
||||||
|
</UnorderedList>
|
||||||
|
<hr />
|
||||||
|
<Heading>100Days100Projects 🚀</Heading>
|
||||||
|
<Paragraph>
|
||||||
|
As a bonus, I created the{' '}
|
||||||
|
<Link
|
||||||
|
href="https://www.florin-pop.com/blog/2019/09/100-days-100-projects"
|
||||||
|
rel="nofollow"
|
||||||
|
>
|
||||||
|
#100Days100Projects challenge
|
||||||
|
</Link>
|
||||||
|
. You can find in there 100 more ideas of smaller projects.
|
||||||
|
Enjoy! 😄
|
||||||
|
</Paragraph>
|
||||||
|
</Pane>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 141 KiB |
|
Before Width: | Height: | Size: 2.6 KiB |
Loading…
Reference in new issue