Giter Site home page Giter Site logo

dvlprwchoi / dev-blog Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 2.7 MB

DEV BLOG is a developer's blog platform. Users can login with their Gmail accounts. Once users are logged into the DEV BLOG, users can create and delete their own blog posts.

Home Page: https://woosik-dev-blog.netlify.app

HTML 8.84% CSS 26.85% JavaScript 64.31%
react reactjs firebase-auth firestore-database googlefirebase css html

dev-blog's Introduction

DEV BLOG

DEV BLOG is a developer's blog platform. Users can login with their Gmail accounts. Once users are logged into the DEV BLOG, they can create, edit and delete their own blog posts. Users also can upload image files to posts.

Previews

Mobile view (iPhone 8)

Landing page on mobile Landing page Create page on mobile Create page

Desktop view

Login page on desktop Login page
Google sign in page on desktop Google sign in


Create post page on desktop Create page
Delete page on desktop Delete post icon (Trash can) for user's post


Landing page on desktop Landing page
Different screen size view on desktop Different screen size view (Responsive design)

Technologies used

Front end

  • ReactJS
  • HTML
  • CSS

Back end

  • Google Firebase (User authentication, Firestore database)

Deployment

  • Netlify

Installation

Download the repo using git
git clone https://github.com/dvlprwchoi/dev-blog.git

Navigate into the site's directory and install dependencies.

cd dev-blog
npm install

Start the Server.

npm start

Open the source code and start editing! Your site is now running at http://localhost:3000!

Links

Future plan

  • Add comment section
  • Add different color theme ✅
  • Add edit post ✅
  • Add delete confirmation
  • Add modal
  • Add restriction on blank submission
  • Add sorting
  • Add uploading photo ✅
  • Add uploading url
  • Add feature that not showing alt text when img file is not existed

dev-blog's People

Contributors

dvlprwchoi avatar

Stargazers

 avatar

Watchers

 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.