The Github Repo for TCHacktoberfest.com
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
layout
out
pages
personalsections
static
utils
.DS_Store
.gitignore
README.md
next.config.js
now.json
package-lock.json
package.json
server.js
style.css

README.md

💀🎃💀 Twin-Cities-Hacktoberfest 💀🎃💀

The Github Repo for TCHacktoberfest.com

What is Hacktoberfest?

A month-long celebration from October 1st - 31st sponsored by Digital Ocean and GitHub to get people involved in Open Source. Create your very first pull request to any public repository on GitHub and contribute to the open source developer community.

https://hacktoberfest.digitalocean.com/

What is this?

We'll be building a website together! http://tchacktoberfest.com/ COMING SOON

What tools will I need?

  • Git / Github
  • HTML ( Written as JSX )
  • CSS
  • JavaScript

How to get started:

Create a Github Account and Fork the Repo:

  1. Create a Github Account
  2. Fork this Repo by clicking the "Fork" icon in the top right corner.
  3. See if Git is installed by opening your terminal application and typing: git --version
  4. Install Node.JS on your machine ( https://nodejs.org/en/ ) -- downloading the 8.X version is recommended.
    • Once Node is installed you can verify that it is working by opening your terminal application and typing: node -v
    • This should return the version of Node that you downloaded and installd ( Example: v8.6.0 )
  5. Clone your forked repository ( https://github.com//win-Cities-Hacktoberfest.git ) down to your local machine
    • ( Additional steps )
  6. Install all of the dependencies using NPM
    • ( Additional steps )
  7. Start your local server
    • ( Additional steps
  8. < Steps of which files to edit >

I haven't used one of these things before, where can I learn more about it?

If you're feeling ambitious I highly suggest going through FreeCodeCamp.org to get a understanding of what the following items are. FCC's mission: to help people learn to code for free. We accomplish this by creating thousands of videos, articles, and interactive coding lessons - all freely available to the public. We also have thousands of freeCodeCamp study groups around the world.

There is no expectation for you to go through FCC before contributing to this project or scheduling some 1:1 time -- but repetition and repeated exposure to topics from different perspectives is often the fastest way to obtain a mastery of a topic.

What is HTML?

In one sentence: HTML is the language used to create webpages.

From Wikipedia: Hypertext Markup Language (HTML) is the standard markup language for creating web pages and web applications. Wikipedia

Guides to help you get started writing HTML:

In this project we will be writing HTML inside of JSX -- JSX is a "sytax extensions" to write HTML inside of Javascript. This has been a very contentious topic over the last couple of years inside of the web development community, but many developers are finding that this way of "HTML / CSS inside of Javascript" to have it's own advantages

What is CSS?

In one sentence: CSS ( Cascading Style Sheets ) is the language used to style HTML.

From Wikipedia: Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript. Wikipedia

Guides to help you get started writing CSS:

What is JavaScript?

In one sentence: Javascript is the langauge used to create custom functionality on web pages.

From Wikipedia: JavaScript often abbreviated as JS, is a high-level, interpreted programming language. It is a language which is also characterized as dynamic, weakly typed, prototype-based and multi-paradigm. Wikipedia

Additional information: JS is a term that can be used in many different contexts. One of these contexts has you use JavaScript as a "client-side" language where the developer will create some interaction within the browser. An example of this would be creating a contact form. JS can be used to validate that the information that the user enters before that data gets sent to the server -- creating a better user experience.

"Server-side" where a developer can leverage a javascript library ( in our case express.js ) to run a web server with NodeJS. This web server can be hosted locally ( leveraging your localhost ) or hosted on a service that allows you to run NodeJS ( such as Heroku, Digital Ocean, Zeit )

What is ES5/6/7/8

In one sentence: The JavaScript community has come together to agree on a standard that is updated on a yearly basis and features are implemented by the major browsers.

From Wikipedia: ECMAScript (or ES) is a trademarked scripting-language specification standardized by Ecma International in ECMA-262 and ISO/IEC 16262. It was created to standardize JavaScript, so as to foster multiple independent implementations. JavaScript has remained the best-known implementation of ECMAScript since the standard was first published, with other well-known implementations including JScript and ActionScript ECMAScript is commonly used for client-side scripting on the World Wide Web, and it is increasingly being used for writing server applications and services using Node.js. Wikipedia

What is React?

In one sentence: React is a state-based JavaScript library used to create user interfaces.

From Wikipedia: In computing, React (also known as React.js or ReactJS) is a JavaScript library for building user interfaces. It is maintained by Facebook and a community of individual developers and companies.

React can be used as a base in the development of single-page or mobile applications. Complex React applications usually require the use of additional libraries for state management, routing, and interaction with an API. Wikipedia

Guides to help you get started with React:

What is NextJS?

In one sentence: NextJS is a framework for React that streamlines some of the processes and allows server-side rendering.

Guides to help you get started with NextJS:

What is Node?

In one sentence: Node is a Javascript runtime that allows you to write and run Javascript outside of the browser.

From Wikipedia: Node.js is an open-source, cross-platform JavaScript run-time environment that executes JavaScript code outside of a browser. Historically, JavaScript was used primarily for client-side scripting, in which scripts written in JavaScript are embedded in a webpage's HTML and run client-side by a JavaScript engine in the user's web browser. Node.js lets developers use JavaScript to write Command Line tools and for server-side scripting—running scripts server-side to produce dynamic web page content before the page is sent to the user's web browser. Consequently, Node.js represents a "JavaScript everywhere" paradigm unifying web application development around a single programming language, rather than different languages for server side and client side scripts. Wikipedia

What is NPM ( Node Package Manager ) ?

In one sentence: NPM is a tool that allows developers to manage and install code libraries that are maintained by the open source community.

From Wikipedia: npm is a package manager for the JavaScript programming language. It is the default package manager for the JavaScript runtime environment Node.js. It consists of a command line client, also called npm, and an online database of public and paid-for private packages, called the npm registry. The registry is accessed via the client, and the available packages can be browsed and searched via the npm website. The package manager and the registry are managed by npm, Inc. [Wikipedia](npm is a package manager for the JavaScript programming language. It is the default package manager for the JavaScript runtime environment Node.js. It consists of a command line client, also called npm, and an online database of public and paid-for private packages, called the npm registry. The registry is accessed via the client, and the available packages can be browsed and searched via the npm website. The package manager and the registry are managed by npm, Inc.)

What is Git?

In one sentence: Git is a tool that allows you to back up your code and collaborate with other people.

From Wikipedia: Git is a version control system for tracking changes in computer files and coordinating work on those files among multiple people. It is primarily used for source code management in software development, but it can be used to keep track of changes in any set of files. Wikipedia

Guides to help you get started with Github: