Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dwyl/start-here
:bulb: A Quick-start Guide for People who want to dwyl :heart: :white_check_mark:
https://github.com/dwyl/start-here
beginner beginner-friendly how-to howto learn starter-kit
Last synced: 27 days ago
JSON representation
:bulb: A Quick-start Guide for People who want to dwyl :heart: :white_check_mark:
- Host: GitHub
- URL: https://github.com/dwyl/start-here
- Owner: dwyl
- Created: 2014-03-02T13:20:04.000Z (almost 11 years ago)
- Default Branch: main
- Last Pushed: 2024-10-16T22:51:40.000Z (3 months ago)
- Last Synced: 2024-10-18T22:59:58.076Z (2 months ago)
- Topics: beginner, beginner-friendly, how-to, howto, learn, starter-kit
- Homepage: https://github.com/dwyl/home
- Size: 243 KB
- Stars: 1,745
- Watchers: 164
- Forks: 106
- Open Issues: 108
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Start Here
==========
A Quick-start Guide for people that want to **D**o **W**hat **Y**ou **L**ove!
> ***Start where you are. Use what you have. Do what you can***.
> ~ [*Arthur Ashe*](https://en.wikipedia.org/wiki/Arthur_Ashe)
## Why?
The world is not perfect.
We have all worked somewhere we _didn't **love**_.
We have _all_ felt the _frustration_ of using products that have flaws
that _we_ were unable to fix ourselves.
We have all experienced being in an environment that
_didn't support us_ in doing all we can do in the world.
**The aim of _dwyl_ is to address *all* of these issues _simultaneously_:**
please read our [**mission**](https://github.com/dwyl/start-here/blob/master/mission.md#what-is-dwyls-mission)
to understand our focus on personal effectiveness
as the starting point for all positive change.
If you'd like to know more about what we value,
_please **read our [manifesto](https://github.com/dwyl/start-here/blob/master/manifesto.md)**_.
The short version is:
"_**Treat others as you would like others to treat you**_" ~
[***The Golden Rule***](https://github.com/dwyl/start-here/blob/master/manifesto.md)
If you want to be part of the solution, join us:
https://www.dwyl.com
> If you haven't read **Simon Sinek**'s book "***Start with Why***",
we *highly recommend* taking a few minutes to watch his **Ted Talk**:
https://www.ted.com/talks/simon_sinek_how_great_leaders_inspire_action
## Who?
**dwyl** is a _**rapidly expanding community**_; here are a few
of the familiar faces contributing to our projects:
[](https://github.com/dwyl/who)
[_**Join us**_](#how) in finding a problem you want to **solve** and will
_**love**_ working on.
## What?
**Q**: What is dwyl?
**A**: dwyl (pronounced "[Will](https://www.youtube.com/watch?v=0sxnonO3FXw)" but with a "D" in front of it) is a _community_ of people on a _**mission to change the world using technology**_.
We are _starting_ by making the tools _we_ need to help us (and the people we care about) _get things we love **done**_.
Our first App is [***Time***](https://github.com/dwyl/time) which helps people ***track any time based activity***.
And we are making ***Everything Open Source*** along the way,
so that you *too* can **D**o **W**hat **Y**ou **L**ove!
We have plans to build *many* other features and we'd *love* you to join us!
Here are a few on the roadmap:
+ [**Tudo**](https://github.com/dwyl/tudo) (_pronounced to-do_) helps you and your team track what you are working on
+ **When?** syncs calendars and selectively shares availability with others to discover the best time for an activity/event
- Birthday/Special Event Helper [*AKA* The Card & Gift App]
What question do _**you**_ want to answer?
### Our Approach: Scratching Your *Own* Itch
We believe in scratching our own itch.
This means solving a problem you (or someone _close_ to you) _personally_ have.
If you don't have any personal experience in a field
you aren't going to do a good job of spotting/solving a problem in that area.
Taking the _"Business School"_ approach of finding a _"Big Market"_ and then identifying a problem to solve works for some companies,
but we prefer the approach of solving something we are **personally passionate about** _regardless_ of the (size of the) "market".
> Read:
https://gettingreal.37signals.com/ch02_Whats_Your_Problem.php
# How?
If you want to get involved with building great tools people love, this section contains everything you need to know.
## What do I need?
+ [ ] **Curiosity** - "I have **no special talent**. I am only _**passionately curious**_." - Albert Einstein
+ [ ] **Enthusiasm** - "Enthusiasm spells the _**difference between mediocrity and accomplishment**_." - Norman Vincent Peale
+ [ ] [**Shoshin**](https://en.wikipedia.org/wiki/Shoshin) (**Beginner's Mind**) - "I'm not young enough to know everything" - J. M. Barrie
+ [ ] **Persistence** - "If you wish to be out front, then act as if you were behind.” - Lao Tzu
+ [ ] **Work Ethic** - ["**work super hard** ... _**every waking hour**_"](https://www.youtube.com/watch?v=gpioK1kIRg4) ~ Elon Musk
+ [ ] **Time** - if you only have _**1 minute**_ there's _something_ you can do _now_!
+ [ ] **Great Google Skills** - the ability to formulate a good question (so you can get a useful answer from Google) is (more than) half the challenge in any ~~coding~~ task
+ [ ] **Self-reliance**: when you get stuck on a task, knowing **when to ask for help** and when to _persevere_ through to find the answer yourself
+ But don't worry, we're here to help! [](https://gitter.im/dwyl/chat/)
### What *tools* will I need?
**Access to a computer**, preferably a recent (but not expensive) one (Chromebooks are Great!).
That's it.
### Do I need to Write *Code* to Contribute?
No. _Everyone_ can contribute, from proposing and voting on ideas,
to simplifying wording to helping people understand our apps.
Please drop by and tell us what you think! [](https://gitter.im/dwyl/chat/)
### Setup (_for Coders_)
If you want to start writing `code` _now_ and don't already have your machine set up, see: https://github.com/dwyl/dev-setup
We also have a [***new developer checklist***](https://github.com/dwyl/start-here/blob/master/new-developer-checklist.md) which we _encourage_ you to review on the various online services you should know about and set yourself up on:
https://github.com/dwyl/start-here/blob/master/new-developer-checklist.md
## Web Development *Fun*damentals
We have listed the skills you need to know in the _order_ you need to learn them.
### Basic Computer Skills
If you don't feel _confident_ using a computer, don't despair!
We've all been there.
There's no "secret" to becoming an expert, just _experiment_! If you get stuck, _**Google**_.
If you're still stuck after an hour, **ask for help**!
If all else fails, *restart* your computer and try again (that's what _**everyone**_ **does**).
### Touch Typing
_**Before**_ you dive into programming, learning how to touch-type on your
computer is the *single* _**best investment**_ you can make.
All this means is _practising_ typing with the "correct fingers" until you don't have to think about where the keys are.
Some of the best programmers we know can type faster than most people can _think_ ... take a moment for that to settle in.
[](https://www.youtube.com/watch?v=Z-iyiWHI2nA "playing piano blindfolded")
You need to be able to **type blindfolded** to become a true maestro (at anything computer-related).
A few touch-typing tutorials anyone can (_should_) do a few minutes per day. There are many variations on the classic [QWERTY layout](https://en.wikipedia.org/wiki/QWERTY). You should choose a tutorial that's compatible with your keyboard layout:
+ Keybr: [https://www.keybr.com/](https://www.keybr.com/)
+ English (US), English (UK), German (DE), German (CH), French (FR), French (CA), French (CH), Italian, Portuguese (BR), Cyrillic
+ Typing Club: [https://www.typingclub.com/](https://www.typingclub.com/)
+ English/US
+ BBC - Dance Mat Typing: [https://www.bbc.co.uk/guides/z3c6tfr#zg8nsbk] (https://www.bbc.co.uk/guides/z3c6tfr#zg8nsbk)
+ English/UK
+ typrX: [https://app.typrx.com](https://app.typrx.com)
+ English/US
+ Typing.com: [https://www.typing.com](https://www.typing.com)
+ English (US), English (UK), English (CA), Spanish, [AZERTY](https://en.wikipedia.org/wiki/AZERTY) (FR), Italian, Portuguese (PT), Portuguese (BR), Norwegian, Icelandic, Dansk, Swedish, Chinese, Japanese, and **many more** (by far the most thorough of the bunch)
+ Typing.io: [https://typing.io/](https://typing.io/)
+ English/US, focuses on **typing code specifically** with emphasis not only on letters but also special characters
You can connect your touch-typing practice with learning to code, by using the code samples in your learning resources to practice your typing. Learning to touch-type accurately is therefore important for creating the proper muscle-memory for the code (Markdown, HTML, CSS, Javascript, etc) that you are learning. Here are resources that explain the importance of typing out code by hand:
+ [The Lost Art of Typing **** by Hand](https://daveceddia.com/the-lost-art-of-typing-shit-by-hand/): Ignoring the profanity in the title, and not reading the comments section, this article is very good at explaining why and how it is important to type by hand.
+ We Are Typists First, Programmers Second: https://blog.codinghorror.com/we-are-typists-first-programmers-second/
+ The Value of Typing Code: https://www.johndcook.com/blog/2012/12/18/the-value-of-typing-code/
+ Don't Copy and Paste Other People's Code, Type it Out: https://shockoe.com/blog/typingcodeout/
### How to Learn How to Learn
Software-development is constant learning, so it is useful to think consciously about how one learns.
#### General Thoughts on How to Learn
A popular course is [Learning How to Learn]( https://www.coursera.org/learn/learning-how-to-learn) on Coursera taught by [Barbara Oakley](https://en.wikipedia.org/wiki/Barbara_Oakley) and [Terry Sejnowski](https://en.wikipedia.org/wiki/Terry_Sejnowski). It serves as a general introduction to concepts about learning how to learn, with a *slight* emphasis on neuroscience.
The following articles by [Blaz Kos](https://agileleanlife.org/blaz-kos/) from AgileLeanLife well summarise a lot of the basic concepts on efficient learning:
+ [Top 10 ways to learn or improve any skill fast](https://agileleanlife.org/how-to-improve-any-skill/): are there better ways to learn or improve a skill?
+ [Optimizing your working memory is more important than your IQ](https://agileleanlife.org/working-memory/): an attention span is a programmer's best friend.
+ [How to study, learn & master things faster than people with the highest IQ](https://agileleanlife.org/how-to-study-and-learn/): not many have consciously thought about how they go about learning.
+ [Learning is useless, validated learning is everything](https://agileleanlife.org/validated-learning/): thinking of how to validate one's learning, improves the learning.
We feel socially obligated to mention Richard Feynman:
+ [The Feynman Technique: The Best Way to Learn Anything]( https://fs.blog/2012/04/learn-anything-faster-with-the-feynman-technique/)
+ [The Feynman Method to Learn to Code Faster](https://medium.com/@benjaminlezama/the-feynman-method-to-learn-to-code-faster-69b628115be3)
Learning to code has many a steep learning curve, but apparently so does becoming an astronaut!
+ [At Work: Chris Hadfield's lessons on loving your job](https://eu.usatoday.com/story/money/columnist/kay/2013/11/16/at-work-love-learning/3525013/): Chris Hadfield gives his own unique perspective on learning how to learn.
#### How Learning to Code Benefits the Mind
Learning to code will challenge you in all sorts of ways, and as long as you push through the challenge, that is good for you!
+ [Can Computer Programming Boost Your Brain Power?](https://blog.teamtreehouse.com/can-computer-programming-boost-brain-power): how will your mind change while learning to code? One of the rare instances where we recommend the comments section!
+ [Programming Literacy: Why Every Kid Should Learn to Code](https://medium.com/javascript-scene/programming-literacy-7bc4ae154b91): among other things, Eric Elliot describes how learning to code at a young age accelerated his academic progress.
#### How to Learn Applied to Programming
Here we present more specific information about learning how to learn and your studies in programming.
+ [Hacking Passion](https://www.kytrinyx.com/talks/hacking-passion/): Katrina Owen breaks down practice into drills, simulations, case studies, direct practice, and imitation. Which kinds of practice are you applying or not applying?
+ [Learning Fluency](https://www.youtube.com/watch?v=AZlOjCZlPLU): Sara Simon talks about learning to learn how to code from the point of view of her many interests such as Chinese, theatre, and chess. Here is the [article](https://medium.com/@sarambsimon/learning-fluency-672988a7ae52)
+ [The myth of the "Real Javascript Developer"](https://www.youtube.com/watch?v=Xt5qpbiqw2g): Brenna O'Brien describes the constant learning journey that is learning to code.
#### Specific Advice about Learning Programming
Here we present specific advice on learning programming. Remember to type out code by hand!:
+ [How to quickly and effectively read other people’s code](https://selftaughtcoders.com/how-to-quickly-and-effectively-read-other-peoples-code/): one of those strange things is almost no one speaks about *reading* code.
+ [The most effective technique for learning to code may surprise you](https://www.huffingtonpost.com/entry/the-most-effective-technique-for-learning-to-code-may_us_57c1d3e0e4b0b01630df54ac): Seperating the description of a solution from its implementation, with applications to pair programming, and programming alone.
+ [Learn Python the Methodical Way](https://realpython.com/learn-python-the-methodical-way/): how to get the most out of project-based tutorials.
### How the internet works
Before setting off to build for the web you may appreciate acquiring some context
as to how it all comes together. There is a fantastic Coursera course called
[Internet History, Technology, and Security](https://www.coursera.org/learn/internet-history)
that offers just this. The course is put together by an enthusiastic instructor who walks
you through the historic events that led to the design of the internet that you
use everyday. It is full of interviews with the folks who contributed many important
bits along the way.
We consider the above course to be the most thorough general introduction to how the Internet works, and we recommend you eventually work your way through it. In case you cannot make the time commitment right now, the following links provide shorter introductions and other points of view:
+ How The Internet Works: https://www.youtube.com/playlist?list=PLzdnOPI1iJNfMRZm5DDxco3UdsFegvuB7
+ How The Internet Works for Developers:
+ https://www.youtube.com/watch?v=e4S8zfLdLgQ
+ https://www.youtube.com/watch?v=FTAPjr7vgxE
### Command Line
The command line is the basic way to communicate with a computer. The following links provide an introduction:
+ Keyboards and Command Line Interfaces: https://www.youtube.com/watch?v=4RPtJ9UyHS0
+ Linux Back to Basics: https://www.youtube.com/watch?v=MmHcOPJEjGA&index=1&list=PLII6oL6B7q78PKy6_R6JTkkYjVXZBZcVq
+ Learn Enough Command Line to Be Dangerous: https://www.learnenough.com/command-line-tutorial
+ Command Line Crash Course: https://learnpythonthehardway.org/book/appendixa.html
### Text Editor
A text editor is the basic tool a programmer uses. Perhaps your main experience is with a [WYSIWYG](https://en.wikipedia.org/wiki/WYSIWYG) text editor such as Microsoft Word. If you need to become more familiar with programmer's text editors, we recommend the following links:
+ The Best Text Editors for Beginners: https://learn.onemonth.com/the-best-text-editors-for-beginners/
+ Learn Enough Text Editor to Be Dangerous: https://www.learnenough.com/text-editor-tutorial
We use Atom, but Sublime is another popular text editor which is good for someone starting. Emacs and Vim are famous old text editors which have a *much* steeper learning curve. We include information about them for "culture", since they form such a basic part of the programming landscape ( see [holy war of the text editors](https://en.wikipedia.org/wiki/Editor_war)):
+ Atom: https://www.youtube.com/watch?v=EyG20hhON6E&index=2&list=PLYzJdSdNWNqwNWlxz7bvu-lOYR0CFWQ4I
+ Sublime: https://www.youtube.com/watch?v=SVkR1ZkNusI&list=PLpcSpRrAaOaqQMDlCzE_Y6IUUzaSfYocK
+ Emacs: https://www.youtube.com/watch?v=Iagbv974GlQ
+ Vim: https://www.youtube.com/watch?v=TwV_VYApysQ&index=2&list=PL13bz4SHGmRxlZVmWQ9DvXo1fEg4UdGkr
### Markdown
If you've never heard of Markdown, get started now: https://markdowntutorial.com/
You can refer to this [book](https://www.markdownguide.org/book) for learning purposes.
### HTML5
You can learn 90% of what you need to know in HTML in a couple of hours, including practice time (from scratch):
_Learn HTML**5** in 1 Hour:_ https://www.youtube.com/watch?v=kDyJN7qQETA
The _rest_ of HTML5 you will learn [_just-in-time_](https://en.wikipedia.org/wiki/Just_in_Time_Teaching)
(only when you **need to know** it).
### CSS
**C**ascading **S**tyle **S**heets (_**CSS**_) is what makes the web attractive. If you want to see the power of CSS, visit ZenGarden:
https://www.csszengarden.com/
CSS3 beginner (or _refresher_) Tutorial (_in one hour_):
https://www.youtube.com/watch?v=CUxH_rWSI1k
#### Further CSS learning
+ Getting started with CSS: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started
+ Shay's Learn to Code HTML & CSS: https://learn.shayhowe.com/html-css/
+ And specifically for CSS layout techniques: https://learnlayout.com/
+ Codecademy CSS: https://www.codecademy.com/en/tracks/htmlcss
+ The CSS Almanac: https://css-tricks.com/almanac/
### JavaScript
Love it or hate it, **JavaScript is** ***Ubiquitous***. Becoming a ***JS Ninja*** is ***essential***.
[Ines](https://github.com/iteles) has prepared some great notes on
[JavaScript The Good Parts](https://github.com/iteles/Javascript-the-Good-Parts).
Keep "**The Good Parts**" in mind while you are writing (and reading) JS.
Watch this 1 hour intro tutorial series: https://www.youtube.com/watch?v=fGdd9qNwQdQ&list=PLoYCgNOIyGACTDHuZtn0qoBdpzV9c327V
and then scan through this 1.5 hour tutorial to pick up some extra points:
https://www.youtube.com/watch?v=fju9ii8YsGs (and tell us if you get stuck).
### Git + GitHub
If you are completely new to Git (_Version Control_) and/or GitHub,
we suggest you check out the following:
+ Git and GitHub for Poets: https://www.youtube.com/watch?v=BCQHnlnPusY&list=PLRqwX-V7Uu6ZF9C0YMKuns9sLDzK6zoiV
+ Beginners Guide to Git: https://guides.github.com/activities/hello-world/
+ Interactive Workshop: https://github.com/jlord/git-it-electron
+ [@NataliaLKB](https://github.com/NataliaLKB)'s Tutorial: https://github.com/NataliaLKB/learn-git-basics
+ [First Contributions](https://github.com/roshanjossey/first-contributions): A project to help you get started with contributing to open source projects
+ Pro Git Book: https://git-scm.com/book/en/v2
### Open Source
You know enough Git and GitHub to make a pull request on an open source project. Before making your first open source contributions, it is useful to gather some context.
#### What is Open Source
+ What is Open Source Explained in LEGO: https://www.youtube.com/watch?v=a8fHgx9mE5U
#### History of Open Source
+ History of Gnu, Linux, Free and Open Source Software: https://www.youtube.com/watch?v=vjMZssWMweA
+ Free/Open Source Software: A Brief History And Concept: https://www.youtube.com/watch?v=pURPtwdBE1M
+ The Cathedral and the Bazaar: https://en.wikipedia.org/wiki/The_Cathedral_and_the_Bazaar
#### Contributing to Open Source
+ How to Contribute to an Open Source Project on Github: https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github
+ How to Contribute to Open Source: https://opensource.guide/how-to-contribute/
#### Open Source Communities
+ Building Welcoming Communities: https://opensource.guide/building-community/
+ Open Source and You: https://www.youtube.com/watch?v=3NpeVabCIog&feature=youtu.be
#### Where to Start on Open Source
+ dwyl: https://github.com/dwyl
+ First Timers Only: https://www.firsttimersonly.com/
+ 24 Pull Requests: https://24pullrequests.com/
+ Your First PR: https://yourfirstpr.github.io/
+ Awesome First PR Opportunities: https://github.com/MunGell/awesome-for-beginners
+ Awesome for Non-Programmers: https://github.com/szabgab/awesome-for-non-programmers
#### General Resources
+ Open Source Guides: https://opensource.guide/
### Design
Building something for _someone else_ is hard.
You don't necessarily know that person.
And worrying about someone else's _"experience"_ with your app can be a full-time job.
However, it is an essential process for everyone involved in software to partake in.
The very best pieces of software are differentiated by the quality of their **User Experience design**.
Experiences are, by nature, personal, contextual, ephemeral, and affected by things beyond your control. The job of designing one is essentially one of embodying the _real people_ that will be using your product and imagining what the experience would be like for them. You should try to take into account as much contextual information about your users state of mind, occupation, preference towards sans-serif fonts, etc. These details will weave a picture of the real humans on the other end of your app and help you make decisions about site structure and navigation as well as other less obvious things like content hierarchy: _what should the user see first?_
#### Further Reading on Software Design
_We are in the process of developing our own reading materials to help you learn about UX and UI design.
In the meantime, here are some recommended links:_
- [Principles of User "Onboarding" through critiques](https://www.useronboard.com/onboarding-teardowns/)
- [125 Tips for Improving UX/UI](https://www.nickkolenda.com/user-experience/)
- [The 9 States of Design](https://medium.com/swlh/the-nine-states-of-design-5bfe9b3d6d85?ref=uxhandy)
- [Find a Great Font Pair](https://fontpair.co/#five)
- [Make a lovely Colour Palette](https://coolors.co/)
## Ready to Get Involved?
If you want to help improve any aspect of the code, **star :star: this repo on GitHub** and _we will add you to the organisation_.
## Curious about what technology we are using?
If you want to know more about the **Technology** "_**Stack**_" we are using
see: https://github.com/dwyl/technology-stack
[](https://hits.dwyl.com/dwyl/start-here)