Course material for Mobile Application Development, Integrated Digital Media, Tandon School of Engineering, NYU

Andreas Borg

Last update: May 1, 2022

Related tags

React Mobile-Application-Development

Overview

Mobile-Application-Development

Course material for Mobile Application Development, Integrated Digital Media, Tandon School of Engineering, NYU

Class 4A - Navigation and Structure

Class 5A - Global State & Local Storage

Class 6 - Midterm presentation

Class 7A - Firebase App with Google Sign in

Class 8A - Firebase storing data and images

Weekly Schedule

Part I: Introduction to Mobile Development with React Native

[01.24.22, 01.26.22] Class 1: Modern JavaScript

[01.31.22, 02.02.22] Class 2: Understanding React

[02.07.22, 02.09.22] Class 3: React beyond the browser - React Native

Part II: Application Architecture

[02.14.22, 02.16.22] Class 4: Component-driven application architecture for mobile

[02.21.22] No class

[02.23.22, 02.28.22] Class 5: Global State, Local Storage & Hooks

[03.02.22, 03.07.22] Class 6: Midterm presentation lab & UX libraries

[03.09.22, - ] Dev support

[03.14.22 - 03.20.22] Spring break

[03.21.22, 03.23.22] Midterm presentations

Part III: Advanced Concepts

[03.28.22, 03.30.22] Class 7: User Authentication

[04.04.22, 04.06.22] Class 8: Database integration

[04.11.22, 04.13.22] Class 9: Animations

[04.18.22, 04.20.22] Class 10: Looking under the hood in Xcode

Part IV: Building, packaging, shipping

[04.25.22, 04.27.22] Class 11: Building and releasing mobile apps

[05.02.22, 05.04.22] Class 12: Final project proposal review

[05.09.22] Final project presentations

Comments

Midterm assignments
Post links to your

prototype repo

UX wireframe + mood board (if it's a url like figma or xd or similar...if it's a pdf you can attach or send in slack)

Let's have fun making things!
opened by borg 13
Assignment 5

Pick one of the global state management frameworks I outlined last week - globalState, Context, Hookstate, EasyPeasy or Redux - and convert your todo app to an app that maintains a global todo state, accessible from any part of the app stores the state in a persistent storage (either Async or remotely), so it's remains on app/browser reload.

I would consider redux the hardest route, so that would give you extra points. If you choose redux you can dig into a video tutorial like this.

opened by borg 12
Assignment 4: React Navigator, with Structured TodoList and Detail screens

Create an app with a bottom tab navigator, with at least two pages, where one is a TaskList nested inside a stack navigator. The Tasklist should work like our previous assignment but have some more details, such as body, date or priority. Clicking on a task should open the Detail page.

For extra points make the top button in the Detail page set the Done status, and make sure the detail page updates the state accordingly. You can also ornament and style as you feel like.

If done as a pair, link to one snack and say who you are.

opened by borg 14
Assignment Class 3: Native To-Do
Build your first mobile app! Port your react ToDo list to native and add done action

Your app should feature:

A dynamic list of To-Do's.

Indication of completion status

A button or checkbox to complete each To-Do.

An input field to create new To-Do's.

A button to clear whole list

Any other fancy features you might like (filtering? multiple selection? coloring? emjoi support?)

Anything else you dug up in the React Native documentation!

Publish your app with expo and post it to the class 3 issue along with your full name.

My demo app used checkboxes, but you can also use any other type of button

This boiler plate is very minimal, but may be some help.
opened by borg 16
Assignment Class 2: To-do list
Part one

Make a minimal to-do list

Use codesandbox.io to make an App component

Add a form text input field

Add a button

Add anything entered into text field to the to-do list

It should end up something like this

Share a link to your repo below

Part two
Select your favorite mobile app and be prepared to show it to class and explain what's so great about it.
opened by borg 16

Owner

Andreas Borg

Creative Director & Founder Elevated Studio // Adjunct professor at NYU Tandon, IDM // Frequent collaborator with Local Projects, Edelman, Gensler

GitHub

Material-UI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.

Material-UI Quickly build beautiful React apps. Material-UI is a simple and customizable component library to build faster, beautiful, and more access

83.6k Dec 30, 2022

This repo for Software Engineering courses purpose

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: ya

2 Oct 13, 2021

🎭 Website source code for our school play.

?? Sane Lunatics Website Website that is built for the theater play "Aklı Başında Deliler Kumpanyası" that will play on stage in ???? Mus Alparslan Un

9 Jun 3, 2022

HTML CSS & React - Client side dynamic e-commerce website (stripe integrated)

Furniture E-Commerce Project Description React front-end full operating dynamic and responsive E-Commerce shop including payment connection (stripe) B

15 Dec 27, 2022

WPPConnect/mobile is an open source project with the objective of automating whatsapp web using the android or ios mobile browser and being able to perform all the functions of our wa-js project

WPPConnect/mobile is an open source project with the objective of automating whatsapp web using the android or ios mobile browser and being able to perform all the functions of our wa-js project, so it is possible to create a customer service, media sending, intelligence recognition based on artificial phrases and many other things, use your imagination to change and modify this project or collaborate on improvements...

11 Dec 28, 2022

Rocket Bank is a finance mobile app built for XP Mobile Challenge.

Rocket Bank is a mobile application made with React Native. You can track your portfolio performance, make deposits and withdrawals, and buy and sell

10 Jul 27, 2022

A simple PWA to scan your EU digital COVID Certificate and generate a passbook from it

COVID-19 passbook Generator The aim of this project is to let a user scan a EU Digital COVID Certificate with their smartphone, and generate a passboo

129 Nov 11, 2022

💸 Use case style digital image marketplace like nft. I developed this system by gathering a lot of my frontend/backend knowledge

❗ WARNING This project is just an educational system, NOT a system made to carry out large transactions and with the same focus as nft. I developed th

53 Aug 30, 2022

Notices on a digital platform are quick and easy to access, reduce a lot of paper waste, and one can get notified about the updates and news.

DigitalNoticeBoard - Mobile App - (Still In DEV) An Notice Board App for Students To Stay Connected With The College Updates..! Why a college campus n

6 Nov 24, 2022

Our Expo-based mobile application for demonstration purposes.

Capable Care reference implementation This repository provides a working example of a React Native mobile application (built on Expo) integrating Capa

11 Oct 1, 2022

USA Covid-19 Tracker is a mobile-first application built with React and Redux to give precise information about the virus behavior in the United States. Great transitions and user feedback made with plain CSS.

React.js USA Covid-19 Tracker This application allows the public to keep track of the stadistics of the Covid-19 Pandemic in the United Stated. You wi

14 Oct 25, 2022

Choosy is a mobile application that allows users to create photo polls that others can vote on and help declare which photo is the best.

Choosy - Create photo polls The freshest mobile application for your photo polls! Explore the docs » Table of Contents Introduction App concept Target

13 Sep 7, 2022

Concircle scanner mobile app is application That helps you scan your order and position and to know if there are exact or not. it's cross-platform app.

Concircle scanner mobile app ⭐ Star on GitHub — it motivates Me a lot! Concircle scanner mobile app is application That helps you scan your order and

10 May 7, 2022

Covid-19 Tracker is a mobile web application showcasing the covid-19 statistics in Africa.

Covid-19 Tracker is a mobile web application showcasing the covid-19 statistics in Africa. when the user clicks on the countries' cards, they will be rendered to the details page that contains more information about the covid-19 in the selected country. Also, the user can search for a specific country using the search bar.

7 Sep 6, 2022

Github-ci-cd-react - I followed CI/CD course from codedamn to learn how to implement github actions in a project, in this practical lesson with codedamn am using ReactJS

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

1 Jan 2, 2022

Small (0.5 Kb) react hook for getting media breakpoints state info in runtime

tiny-use-media Small (0.5 Kb) react hook for getting media breakpoints state info in runtime Usage npm i tiny-use-media --save Adn in your react code

51 Dec 13, 2022

Mini Social Media App with a liitle bit of facebook components (Still Developing)

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

2 Apr 11, 2022

A frontend Framework for building B2B applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design

react-admin A frontend Framework for building data-driven applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Materi

21.2k Dec 30, 2022

A set of React components implementing Google's Material Design specification with the power of CSS Modules

React Toolbox is a set of React components that implement Google's Material Design specification. It's powered by CSS Modules and harmoniously integra

8.7k Dec 30, 2022