Host Your Web Analytics Project Online (Phase 10.1)
Welcome to Phase 10.1 Making Your Work Accessible to the World
Congratulations on completing the analytical and visualization phases of your web analytics project. You have gathered insights built models and created compelling visualizations. You have also prepared a comprehensive summary report. Now it is time for the final crucial step. In this phase we will learn how to host your web analytics project website online. Think of this as opening your data insights to a wider audience. It allows you to share your work with potential employers collaborators or anyone interested in your findings. This is essential for showcasing your skills and making your project a tangible part of your professional portfolio.
This step is crucial for demonstrating your end to end project capabilities and enhancing your professional presence.
Why Host Your Project Online
Having your web analytics project live online brings multiple benefits and helps you go beyond just completing a local assignment. Here's why it really matters:
• Showcase Your Skills: Let others interact with your data analysis, machine learning, and visualizations directly through your live project.
• Portfolio Enhancement: A hosted project creates a stronger impression than just sharing code—it shows your work in action.
• Shareable Link: Easily share your work with recruiters, mentors, or peers with a simple URL.
• Accessibility: Your project is available 24/7 from anywhere, making it easy for others to explore whenever they want.
• Real-World Experience: Deploying your project helps you gain hands-on experience with hosting and web deployment—a valuable and in-demand skill.
• Feedback and Collaboration: It’s much easier to get feedback or collaborate with others when your project is live and accessible.
Hosting your project turns it from a local file on your computer into a shareable and professional part of your data portfolio.
Choosing a Hosting Solution for Your Static Website
Now that your web analytics project is complete, it’s time to bring it online. Your website contains mostly static content like HTML, CSS, JavaScript, and images — and there are several great free or affordable options for hosting it. Here are two popular platforms that are perfect for this purpose:
1. GitHub Pages
• Ideal for hosting static websites straight from your GitHub repository.
• Completely free, easy to use, and integrates well with version control.
• Great for portfolio projects and documentation-based sites.
2. Netlify
• Offers a smooth and user-friendly deployment process for static websites.
• Also free for most personal projects and includes extra features like custom domains, HTTPS by default, and continuous deployment from GitHub.
• A great option if you want a little more flexibility and automation.
Both platforms work well for showcasing your project website. If you plan to include a Streamlit dashboard in the future, that will require more advanced hosting solutions like Streamlit Cloud or a dedicated server. For now, we’ll focus on publishing your HTML-based documentation using GitHub Pages or Netlify.
Steps to Host Your Website Using GitHub Pages
GitHub Pages offers a simple way to publish your website directly from your GitHub repository. If you have already pushed your SankalanAnalyticsProject
to GitHub (from Phase 0.4), follow these steps to get your site live.
1. Ensure Your Repository is Public (or Configured for Pages)
GitHub Pages works best with public repositories. If your repository is private, you might need a paid GitHub plan or adjust settings to enable Pages. For portfolio projects, making your repo public is usually the best choice.
• Go to your SankalanAnalyticsProject
repository on GitHub.com.
• Click on the Settings tab.
• In the left sidebar, click on Pages.
2. Configure GitHub Pages
On the Pages settings page, you’ll set the source for your website.
• Under Source, select the branch to deploy from—usually main
or master
.
• Choose the folder where your website files are stored. In this case, select the /website
folder from the dropdown.
• Click Save.
GitHub will now build and deploy your site. This can take a few minutes. After deployment, GitHub will provide a URL where your website is live (e.g., https://yourusername.github.io/SankalanAnalyticsProject/
).
3. Verify Your Live Website
Open the URL provided by GitHub in your browser. You should see your index.html
file or the directory listing of your /website/
folder live online. Navigate through your project pages to make sure all links and content work properly.
Steps to Host Your Website Using Netlify (Alternative)
Netlify provides a simple and user-friendly way to deploy static websites and works smoothly with GitHub. Follow these steps to get your project live on Netlify.
1. Sign Up for Netlify
• Go to www.netlify.com and create a free account.
• You can sign up directly using your GitHub account for easier integration.
2. Connect to Your GitHub Repository
• After logging in, click on Add new site and choose Import an existing project.
• Select Deploy with GitHub.
• Authorize Netlify to access your GitHub account if prompted.
• Search for and select your SankalanAnalyticsProject
repository.
3. Configure Deployment Settings
Netlify will try to detect your project settings automatically. You might need to adjust the publish directory.
• Owner: Your Netlify account.
• Branch to deploy: Select main
or master
.
• Base directory: Leave blank if your website
folder is in the root directory. If it is inside the project folder, enter /website
.
• Build command: Leave this blank since it’s a static HTML site.
• Publish directory: Enter website
.
• Click Deploy site.
Netlify will then build and deploy your site. It will provide a unique URL (e.g., https://random-name-12345.netlify.app/
). You can set up a custom domain later if you want.
4. Verify Your Live Website
Open the URL Netlify provides in your web browser. Check that your website is live and all pages and links work correctly.
Overall Value of Online Hosting
Hosting your web analytics project website online is the final step in making your hard work visible and impactful. It transforms your local project into a professional, accessible portfolio piece. This live demonstration of your skills in data analysis, machine learning, and web deployment will significantly enhance your resume and interview discussions. It is a tangible testament to your ability to deliver end to end data solutions.
Next Steps
You have successfully hosted your web analytics project website online. This means you are now proficient in deploying static web content.
The next and final exciting phase will be to add your project to your GitHub portfolio with a ReadMe. This will ensure your project is well documented and easily discoverable by potential employers. It will also involve preparing to pitch your project confidently in interviews.
For now, make sure you save this HTML file in your E:\SankalanAnalytics\website\
folder. Name the file: phase-10-1-hosting.html
.