Giter VIP home page Giter VIP logo

futurecoder's Introduction

futurecoder

This is a platform/course for people to teach themselves programming in Python, especially complete beginners at programming.

You can try a demo here: https://futurecoder.herokuapp.com/

Currently this is a work in progress. While most of the groundwork is in place, there is a lot to do to make this a complete course ready for users. All kinds of help are needed and greatly appreciated - please consider contributing!

Features

The course is a fully interactive 'book' which requires the user to run code in the provided editor or shell to advance:

full

The code at each step is checked automatically. Common mistakes can be caught and pointed out to the student. If needed, the student can get small hints to gradually guide them to the solution:

hints

If they're still really stuck, they can reveal the solution bit by bit:

solution

Tracebacks are more helpful than usual, highlighting the exact operation which failed and ensuring that the right amount of context is visible for multiline statements:

traceback

Several debuggers are provided, including snoop:

snoop

birdseye:

birdseye

and Python Tutor:

pythontutor

Running locally

  1. Fork the repository, and clone your fork.
  2. If you want to run the system using Docker, which may be easier and will more closely resemble the production environment:
    1. Ensure you have docker and docker-compose installed.
    2. Create an empty file called .env in the repo root.
    3. Run docker-compose up.
    4. Skip the following two steps, everything should be running now.
  3. In the backend folder:
    1. Ensure the python command points to Python 3.8.
    2. Run ./setup.sh. This will:
      1. Install poetry if needed.
      2. Create a virtualenv and install Python dependencies.
      3. Create a sqlite database, run migrations, and create a user.
    3. Activate the virtualenv with poetry shell.
    4. Run the backend development server with ./manage.py runserver.
  4. In the frontend folder:
    1. Ensure you have recent versions of node and npm.
    2. Run npm install to download dependencies.
    3. Run npm start to start the frontend development server.
  5. Go to http://localhost:3000/accounts/login/ and login with the email "[email protected]" and the password "admin".
  6. You should be redirected to http://localhost:3000/course/ and see the start of the course: "Introducing The Shell".

Controls

The course consists of pages and each page consists of steps. Each step requires that the user runs some code that satisfies the requirements of that step. Once they succeed, they are shown the next step. Once they complete all the steps in a page, they are shown the "Next page" button to move forward. They can click "Previous" if they want to review completed pages, but it doesn't affect their progress - any code they submit is still evaluated against the current step, and refreshing the page returns to the last page. Hopefully these basics (without the formal details) should become intuitively clear to the user as they try to use the site.

To explore the course more freely:

  1. Click the hamburger menu icon in the top left.
  2. Click Settings.
  3. Turn Developer mode on.
  4. This should give you two red buttons floating at the bottom of the screen. They change the currently active step, so you can move forward without having to complete exercises or backwards to test a step again.

At the beginning of the course only the shell is available to encourage quick exploration. After a few pages an editor is introduced to allow running full programs.

The course provides three debuggers to specially run code: snoop, PythonTutor, and birdseye. Each should only become available starting from a specific page which introduces that tool. No such page has been written yet for birdseye, so for now it's immediately available when the editor is introduced.

futurecoder's People

Contributors

alexmojaki avatar bobankh avatar hadi-f90 avatar tony avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.