This project is a demonstration of building a dynamic web application using HTML, CSS, and JavaScript, with the integration of Bootstrap for enhanced styling and interactivity. It also includes various tasks such as implementing data loading from an external source, utilizing Bootstrap components, setting up linting with ESLint, and minifying CSS and JavaScript files for optimization.
- Clone the repository to your local machine.
- Open the project directory in your preferred code editor.
- Install the ESLint plugin in your editor and configure it with the provided
.eslintrc
file.
To run the project, open the index.html
file in your preferred web browser.
- Integration of Bootstrap for styling and interactivity
- Data loading from an external source
- Implementation of ESLint for code linting
- Minification of CSS and JavaScript files for optimization
If you are a CareerFoundry Student, this project is module #1 of the Full-Stack Immersion course. If you are not too sure about your code and you need a reference, you can use the following links to compare your code with mine.
- 1.1: What is JavaScript?: https://github.com/jorgecortesdev/cf-1-simple-js-app/commit/5c5a15777b18322a93554be0b6071506f27d40c2
- 1.2: JavaScript Basics Part 1: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/1/files
- 1.3: JavaScript Basics Part 2: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/2/files
- 1.5: JavaScript Functions Part 2:
- 1.6: DOM Interaction: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/5/files
- 1.7: APIs, Ajax & Asynchronous Behavior: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/6/files
- 1.8: Creating UI Patterns with JavaScript: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/7/files
- 1.10: Bootstrap & UI Libraries: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/8/files
- 1.11: Performance & Debugging: https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/9/files
If you are wondering why there are some missing numbers is because the lesson or the task wasn't directly related to the code and didn't require any modification of the app.
Additionally, if you want to extend your project you might want to read the code in the other branches.
- https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/10/files
- https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/11/files
- https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/12/files
- https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/13/files
- https://github.com/jorgecortesdev/cf-1-simple-js-app/pull/14/files
The exercise branches are called Task-1.x
, where x
stands for the exercise number.
The extra content branches start with a number which is the order and the feature added, ex. 1-bonus-upgrade-bootstrap
.
If you want to clone a particular branch to review the code on your computer, first make sure you are in a different folder of your project. Then you can do the following (change the branch name if you want a different branch):
git clone https://github.com/jorgecortesdev/cf-1-simple-js-app.git
cd cf-1-simple-js-app
git checkout Task-1.2
Or
git clone https://github.com/jorgecortesdev/cf-1-simple-js-app.git --branch Task-1.2
cd cf-1-simple-js-app
If you’re interested in studying with CareerFoundry, you can use my referral link for a 5% discount on one of the courses: https://careerfoundry.com/en/referral_registrations/new?referral=ArJpwnEw
Currently, the sole maintainer is @jorgecortesdev - more maintainers are quite welcome.
See LICENSE.md.